🗒 Cheat Sheet← Lesson
BitWithBite
React Worksheet

🏆 Final Project: React App + Deploy

Chapter: Real-World Projects & Deployment · Level ★★★ · Time: Multi-day
SCORE___ / 20
NameClassDate
After this worksheet you can
Plan a full React capstone appCombine Router, Query, and ContextDeploy to VercelWrite a portfolio-ready README
📚 Quick Recap

🎯 What you'll practice: Planning and self-checking the capstone React app against the full course requirements.

🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4

1Server data should be fetched using:
2Global state (auth/theme/cart) should use:
3Environment variables (API keys) should be:
4The final deliverable should include:

🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11

5The app should include at least one nested route with a shared .
6The live URL must work end-to-end, not just .
7List the 4 required technical features of the capstone checklist.
8List the 3 deployment requirements.
9Why should env variables never be committed to Git, even in a private repo?

🚀 Section C · Challenge ● CHALLENGE 5

10Pick your capstone idea and outline: the main resource, the routes your app needs, and which piece of state will live in Context.
💭 Reflection — the most useful thing I learned:
A ___/4   B ___/11   C ___/5   Total ___/20 Teacher's Signature Parent's Signature
✂ answer key — fold or cut before handing out

1-B   2-A   3-B   4-B  |  5 = layout   6 = localhost   7 = multiple pages via React Router with a nested route, server data via React Query for at least one resource, global state via Context, responsive styling   8 = push to GitHub, deploy to Vercel with env vars in the dashboard, confirm the live URL works end-to-end   9 = Because repo access can widen over time (collaborators, forks, accidental publicity), and committed secrets remain in Git history even after deletion — env vars kept out of Git avoid that permanent exposure  |  10 = Answers vary — e.g. a "Recipe" app with routes "/", "/recipes", "/recipes/:id", "/favourites", with favourites state stored in Context and recipe data fetched via React Query.

📄 Need offline practice?Print this worksheet or open the one-page cheat sheet.
🗒 Cheat Sheet