About the Creator

Why did I choose this project?

My name is Derek Stento, and when choosing a project for my portfolio, I was drawn to the idea of creating a finance or budget tracker. I've always considered myself good at managing my finances, so it seemed like a perfect fit for creating a real working application for this skill.

Why I chose this career?

I started learning programming because I wanted a career that constantly challenges me, lets me grow my skills, and connects directly to real work happening in the world today. I’ve been teaching myself through reading, watching, and—most importantly—building hands-on projects, which is why I put so much effort into creating My Sprout budget tracker.I naturally gravitate toward backend development because I’m a numbers-driven thinker, and I enjoy working with data that represents real-world behavior. I like building systems that turn that data into something useful and efficient. Throughout my learning journey, I’ve proven to myself that I don’t quit; even when concepts feel confusing or problems seem harder than expected, I keep pushing until they finally make sense.I don’t obsess over long-term titles—I focus on direction and consistent progression. My first goal is to get hired, provide real value, and become great in that role. Once I master that, I aim to grow into whatever higher-level responsibilities come next.Two qualities I’m most proud of are my drive to optimize anything important and my refusal to give up on problems I care about. When something matters, I’ll throw everything—time, effort, focus—into solving it. I’m also excited to join a development team so I can learn how experienced engineers think, identify my blind spots, and grow through collaboration.

About the projcet Sprout

Tech Stack

  • Backend: Python, Flask Framework, PostgreSQL Database

  • Frontend: Vanilla Javascript, HTML, CSS

  • Deployment: Docker, Nginx, Cloud Hosting (Render)

How Sprout works?

System ArchitectureSprout is built using a clean three-tier architecture: a vanilla JavaScript frontend, a Flask REST API backend, and a PostgreSQL database. The frontend communicates with the backend through fetch() requests, and the backend handles all data logic, validation, and persistence.Backend (Flask API)The backend is organized into modular blueprints (auth, expenses, categories, preferences, rollover), each handling a specific feature area. Routes use decorators for authentication, error handling, and consistent response formatting. Sessions are managed with HTTP-only cookies, and all protected endpoints run through a @requireauth decorator.Database LayerAll data operations use parameterized SQL queries via psycopg2 to prevent SQL injection. A shared runquery() helper manages connections, transactions, and returns results as dictionaries. The schema is fully normalized with foreign keys and cascading deletes, using efficient JOINs to fetch combined data like expenses with their categories.Frontend (Vanilla JS)The frontend uses the native fetch() API for all communication, automatically selecting the correct API base URL for dev vs production. Each page loads its own JavaScript module, with shared utilities for authentication and API requests. Returned JSON is rendered dynamically into the DOM through template literals and direct manipulation.Core Logic & FeaturesKey logic—like budget rollover, spending calculations, and plant state changes—is processed server-side. The frontend simply receives ready-to-render JSON, keeping the UI lightweight and fast. Date handling uses UTC consistently, supported by utilities like getdaybounds() for accurate daily calculations.SecurityBoth client and server validate inputs, and server-side sanitization removes malicious patterns. All sensitive values (DB URLs, secrets, email settings) are stored in environment variables loaded via python-dotenv in development and injected directly in production. Sessions are protected with secure, HTTP-only cookies.DeploymentIn production, Sprout runs inside a Docker container where Nginx serves static files and reverse-proxies API requests to Gunicorn. The app is deployed on Render with managed PostgreSQL, health checks, and environment-based configuration. Database connection strings and secrets are injected securely at runtime.PerformanceOptimizations include database indexes, efficient SQL queries, and in-memory caching for frequently accessed user data. UNION queries combine default and user-defined categories in a single request, reducing round trips and improving load times.

Contact Info

Email: [email protected]