FROM CONCEPT TO SOMETHING REAL
Small projects.
Real breakthroughs.
Fifteen working projects. Eight come from the original practice sets, one is the HTML and CSS page, two are React projects, Open Source Contribution is the Git capstone, and three are Node, Express, and MongoDB APIs. Read the code, run it, then make a version of your own.
1 SOURCE FILE
BMI calculator
Turn two inputs into a calculated result and a clear validation message.
About 25 minutes
1 SOURCE FILE
Character counter
Keep a live character count and remaining allowance in sync.
About 20 minutes
1 SOURCE FILE
Guess the number
Use the original guessing and scoring logic in a keyboard-friendly form.
About 25 minutes
1 SOURCE FILE
Cart quantity
Trace every button to the single cartQuantity value.
About 20 minutes
2 SOURCE FILES
Rock, paper, scissors
Build on the real game: moves, a persistent score, and automatic play.
About 40 minutes
1 SOURCE FILE
Color scheme switcher
Let each original color box change the page through one shared listener.
About 25 minutes
1 SOURCE FILE
Todo app
Use todoList, renderTodoList, and addTodo to build an actual task workflow.
About 45 minutes
2 SOURCE FILES
DOM mini-app collection
Connect the original shipping calculator, subscribe button, and coin game.
About 50 minutes
1 SOURCE FILE
Responsive field notes
Build one HTML page whose CSS stacks on a narrow viewport and opens into a sidebar plus a notes grid when there is room.
About 45 minutes
3 SOURCE FILES
Recipe Box
Browse a local set of recipes, search them, open a detail route, and keep favorites in sync. Apply the React lessons in one small app.
About 90 minutes
3 SOURCE FILES
Name Tags
Render a small board of name tags, wire a controlled greeting, and add a new tag to the list. A first React project after the early lessons.
About 35 minutes
2 SOURCE FILES
Open Source Contribution
Fork greeting-kit, add a farewell function, respond to review, resolve a real conflict with main, and undo a published merge with revert.
About 75 minutes
1 SOURCE FILE
Notes API
Build a small notes API: one route, then full CRUD on an in-memory MongoDB, then reject empty titles on create and update.
About 45 minutes
1 SOURCE FILE
Task Manager API
Grow a task API through layered structure, list controls, category references, an index check, validation with rate limits, and structured logs.
About 90 minutes
1 SOURCE FILE
AI Content Assistant API
Capstone API: layered routes, a model call, streamed drafts, real validation of a malformed model body, stored history with pagination, and an AI-only budget gate.
About 120 minutes