Brain

Full stack learning path discussed on 2026-03-19. Use Angela Yu's course as the backbone, but focus effort on the highest-value sections and build real projects alongside it. Phase 1: Frontend Foundations Focus on HTML, CSS, Flexbox, Grid, responsive design, basic Bootstrap, and basic JavaScript. Goal: build pages that actually look decent, understand structure and layout, and stop being afraid of JavaScript basics. Projects: personal homepage, product landing page, simple interactive page with buttons, forms, and DOM changes. Checkpoint: can build a webpage from scratch without following line by line. Phase 2: JavaScript Core Focus on variables, arrays, objects, functions, loops, conditionals, DOM, events, async basics, and fetch/APIs. Goal: understand how interactive web pages actually work. Projects: vanilla JS to-do list, weather app using API, quiz app, calculator or habit tracker. Checkpoint: can read and write medium-sized JavaScript without feeling lost. Phase 3: Git, Terminal, and Workflow Focus on terminal basics, files and folders, git init/add/commit/status/log, and GitHub push/pull basics. Goal: stop treating tooling like magic. Projects: put practice projects into GitHub, make at least one repo per project, write simple README files. Checkpoint: can create a repo, commit changes, and push them without confusion. Phase 4: Backend Focus on Node.js, Express, routes, request/response, middleware, APIs, error handling, and environment variables. Goal: understand how the server side works. Projects: notes API, task API, contact form backend, simple journaling backend. Checkpoint: can build a backend that accepts, stores, and returns data. Phase 5: Database Focus on SQL, PostgreSQL, tables, relationships, joins, inserts/updates/deletes, and connecting backend to database. Goal: stop building apps that lose all their data on refresh. Projects: task tracker with PostgreSQL, habit tracker with user accounts, notes app with categories/tags. Checkpoint: can design a simple database schema and connect it to an app. Phase 6: Auth Focus on sessions, cookies, login/signup, password hashing, protected routes, auth vs authorization. Goal: build an app that feels like a real app, not just a demo. Projects: auth-based dashboard app, user-specific tasks or notes app. Checkpoint: users can sign up, log in, and only see their own data. Phase 7: React Focus on components, props, state, effects, forms, conditional rendering, API calls, and simple app structure. Goal: build a proper frontend for your backend apps. Projects: React frontend for task app, React dashboard for notes app, project tracker app. Checkpoint: can build a React frontend that talks to a backend API. Phase 8: Deployment Focus on environment variables, production vs dev, deploying frontend, deploying backend, database hosting basics, and domain/DNS basics later. Goal: get work online. Projects: deploy one full stack app, then deploy a second cleaner version later. Checkpoint: can send someone a link to something built. What to skip or downplay: jQuery, deep Web3/DApp material, legacy-feeling sections that do not help the actual goal, and polishing tutorial projects forever. Best project path in order: personal site, vanilla JS to-do app, weather/API app, Express notes API, PostgreSQL-backed task app, auth-based dashboard, React frontend for the dashboard, deploy the full stack version. Weekly study flow: 3-4 study sessions per week, 60-90 minutes each, with 2 sessions on course material and 1-2 sessions rebuilding or extending what was learned. Each week should include watching, coding, rebuilding from memory, and one small independent change. Progress indicators: can build without pausing every two minutes, can debug own mistakes, can explain what code is doing, and can change a project beyond the tutorial. Main instruction: do not aim to finish the whole course fast. Aim to finish the important sections, build real projects alongside them, keep notes on what is actually understood, and ask for help when blocked instead of silently spiraling. Phase 1 execution plan: The goal of Phase 1 is not just to learn frontend in the abstract, but to get comfortable making pages on purpose. What to learn: HTML structure, semantic elements, headings, paragraphs, links, images, lists, forms, CSS selectors, colors, spacing, borders, typography basics, Flexbox, Grid, responsive layout, basic Bootstrap, and very basic JavaScript for interaction. What to build: personal homepage, product landing page, and a simple interactive page with buttons, form input, and DOM changes. How to work: for each major section, watch the lesson, build along once, rebuild the same thing without following line by line, then change one thing independently. Examples of independent changes: different color palette, different layout, add a section, make it mobile-friendly, or add a button interaction. Weekly rhythm for Phase 1: 3 to 4 sessions per week, 60 to 90 minutes each, with 2 sessions on course content and 1 to 2 sessions rebuilding or improving your own version. Suggested learning order: HTML basics, CSS basics, Flexbox, Grid, responsive design, basic Bootstrap, and basic JavaScript DOM work. Rules: do not copy blindly, do not chase perfection, do not move on if you cannot explain what the code is doing, and do not spend forever polishing one tutorial page. Phase 1 checkpoint: can build a simple webpage from scratch, style it so it does not look broken, make it work on desktop and mobile, and add a little JavaScript interaction without panicking. Best outcome by end of Phase 1: 3 small projects, 1 GitHub repo for each project if possible, and enough comfort with HTML/CSS/JS basics that Phase 2 does not feel impossible. --- **2026-03-19 10:50:13 UTC | AI Update via MCP**