Expert · Capstone, portfolio and getting work · topic 31 of 34 · 30 min
Capstone project brief
Explanation
What the capstone is
A capstone is the last stone placed on top of a wall. Here it means one finished project that uses everything from this course. Employers and clients trust a working app they can open on their phone far more than a certificate.
Pick your project
Option A is to finish and ship the Notes app you built in this course, with polish and one extra feature. Option B is a new app of the same size. "Same size" means users plus two or three main tables, one owner for each record, and about 6 to 10 API endpoints. Pick a problem that people you know really have, so you can get real feedback.
| Project | Main tables | Extra feature idea |
|---|---|---|
| Notes app (Option A) | users, notes | Tags or image attachments |
| College event booking | users, events, bookings | Seat limit with a waiting list |
| Kirana shop billing | users (shop staff), products, bills, bill_items | Daily sales total and a printable bill |
| Hostel mess menu and feedback | users, menu_days, feedback | Average rating per dish for each week |
| Expense splitter for flatmates | users, groups, expenses, shares | A "who owes whom" settlement list |
Required features
- Auth: sign up, log in and log out. Passwords hashed with Argon2id or bcrypt. A session cookie with HttpOnly, Secure and SameSite=Lax.
- Full CRUD with ownership: CRUD means Create, Read, Update and Delete. Every query filters by the logged-in user, so nobody can read or change another user's records.
- Validation on both sides: the form shows friendly errors at once, and the server checks the same rules again and answers 400 with the standard error shape.
- Search: find records by words, for example notes by title or body.
- At least one extra feature: image attachments, tags, export to CSV, a dark mode that is remembered, or something similar.
- Tests: a few unit tests and integration tests for the main API routes (including "user B cannot see user A's data"), run by GitHub Actions on every push.
- Deployed live with HTTPS: a real link that works on a phone, with secrets in environment variables, never in the code.
- README: what the app does, the live link, screenshots, how to run it locally and the decisions you made.
A 4-week milestone plan
A milestone is a checkpoint with a date and a result you can show. Plan about 1 to 2 hours a day. Each week ends with something that works, not just something "in progress".
| Week | Work | What you can show at the end |
|---|---|---|
| 1. Plan and foundation | User stories, MVP list, tables, API contract, repository, signup and login | Sign up, log in and log out work on your laptop |
| 2. Core CRUD | All create, read, update and delete routes with ownership checks; screens with loading, empty and error states | A logged-in user can manage only their own records |
| 3. Search, extra feature, tests | Search, the extra feature, unit and integration tests, CI with GitHub Actions | Tests pass (green) on every push |
| 4. Ship and polish | Deploy with HTTPS, test on a phone, fix bugs found by 3 real users, README, screenshots, 2-minute demo video | A live link you can send to anyone |
Milestone: Week 2, Core CRUD
[x] POST /api/notes with server validation
[x] GET /api/notes returns only my notes
[ ] PATCH /api/notes/:id checks the owner
[ ] DELETE /api/notes/:id checks the owner
[ ] Notes list: loading, empty and error states
[ ] Note form shows an error under each fieldDefinition of done
A definition of done is a fixed list that every feature must pass before you call it finished. Without it, "almost done" can last for months. Ours: it works on the live site, not only on your laptop; it works on a phone and with the keyboard; the server validates input and checks the owner; it has at least one test and CI is green; errors show a clear message, never a blank screen; and there are no secrets in the code.
How it will be judged
| Area | Weight (out of 100) | What a reviewer looks for |
|---|---|---|
| Works live | 25 | The link opens over HTTPS; sign up and the main flows work on a phone |
| Security and data | 20 | Hashed passwords, ownership checks, server validation, no secrets in the repository |
| Code and tests | 20 | Clear structure and names; tests that run in CI |
| User experience | 15 | Loading, empty and error states; mobile layout; labels and keyboard use |
| README and demo | 20 | A stranger can understand, run and judge the project in 5 minutes |
Watch the lesson
Capstone project brief · 1/7
This is the last module. You will build one complete app and put it online. We call it the capstone.
Prefer a video by a teacher? Find free videos on “full stack capstone project plan build deploy portfolio” on YouTube ↗
In real life: A hostel mess feedback app
A second-year student builds a mess menu and feedback app for her hostel. In week 1 she plans the tables (users, menu_days, feedback) and gets login working. In week 2 students can post one rating and comment per meal, and edit or delete only their own. In week 3 she adds search by dish and a weekly average rating for each dish, with a test that proves one student cannot edit another student's feedback. In week 4 she deploys it, shares the link in the hostel group and fixes the three bugs users report on the first day. In interviews she shows the live app, how many students used it and how she fixed those bugs.
Practice (0/3 done)
Your capstone checklist is an array of items like { task: "Login", done: true }. Write progressPercent(checklist) that returns the percent of items that are done, rounded to the nearest whole number with Math.round. An empty checklist returns 0.
Write the plan for your capstone (the Notes app or one of the other ideas) in a file called PLAN.md in your repository. Check it against the list before you write any code.
Build and ship your capstone. Before you call it finished, go through this list on the live site (not on your laptop), using a phone for at least half of the checks.
Quick quiz
Read more (free)
Pass the quiz (60% or more) or mark this topic as done when you are ready.
Your progress is saved on this device only.