Build The Ledger: A Step-by-Step Full-Stack Budget App
Build a practical personal budget ledger with React, Express, and a simple JSON database, one focused implementation step at a time.
Build a real personal finance application from a prepared interface to a working full-stack product.
What you are building
The Ledger is a small budget tracker styled like a paper ledger book. The finished app lets a user record income and expenses, browse entries by month, manage categories, edit and remove transactions, and inspect summaries and spending trends.
The course follows the actual codebase. You will work with the project’s real React components, context, hooks, Express routes, JSON persistence layer, and financial calculations rather than learning a generic application architecture.
Prerequisites
You should be comfortable with basic JavaScript syntax, arrays, objects, functions, and browser developer tools. Some familiarity with React is helpful, but the course introduces framework concepts at the point they are needed.
You will also need Node.js, npm, a code editor, and a terminal.
How the course works
Each implementation lesson answers one practical question: what does the project need to change next? You will open the named file, make a focused change, run the application or tests, and verify a visible result before moving on.
The starter includes the prepared interface, styles, sample data, and the initial project scaffolding. The lessons progressively connect and improve those pieces until they match the completed application.
Final project
The completed Ledger uses:
- React 18 with Vite on the client.
- React Router for the three application pages.
- React Context plus small hooks for shared state and month selection.
- Express for the API.
- A JSON file as the local persistence layer.
- Integer cents for money values.
- Centralized financial rules and dependency-free Node tests.
Out of scope
This project intentionally stays small. The course does not add user authentication, multi-user accounts, a hosted database, budgeting goals, bank integrations, or a separate design system.
Project path
data/courses/build-the-ledger/
The first lesson explains how to download the starter and run it locally.