Track · ~6 months · 48 nodes

Frontend.

HTML, CSS, JS, React, and the patterns real teams use.

Start the path →See full graph →

Foundations

What the web is and how it gets to the user.

  1. How the internet worksClients, servers, packets, and the trip your request takes.
  2. HTTP & HTTPSThe protocol the browser speaks. Methods, status, headers.
  3. Browsers & renderingHow a browser turns markup into pixels you can see.
  4. Domain names & DNSHow a typed name becomes the IP your browser actually hits.
  5. Web hosting basicsStatic, dynamic, edge — where your code actually lives.

HTML

Structure, semantics, and the contract with the browser.

  1. HTML basicsStructure, elements, attributes — the foundation of every UI.
  2. Semantic HTMLUsing the right tag for the right job. Accessibility starts here.
  3. Forms & validationInputs, types, native validation, and the UX of errors.
  4. Accessibility basicsWAI-ARIA, keyboard nav, contrast, screen readers — the floor.

CSS

Layout, theming, and the modern toolkit.

  1. CSS basicsSelectors, the cascade, the box model — what you can't fake.
  2. Flexbox & GridModern layout: when to reach for which, and how they compose.
  3. Responsive designOne codebase, every screen. clamp, container queries, fluid type.
  4. CSS variables & themingDesign tokens, dark mode, and themes that don't fight you.
  5. Modern CSS:has, color-mix, container queries, view transitions.

JavaScript

The language that runs the web. And TypeScript.

  1. JavaScript basicsTypes, functions, scope, control flow. The fundamentals.
  2. DOM manipulationquerySelector, addEventListener, and the bridge from JS to pixels.
  3. ES6+ featureslet/const, arrow fns, destructuring, spread, optional chaining.
  4. Async & promisesCallbacks, promises, async/await — the concurrency model.
  5. ES modulesimport/export, side effects, tree-shaking — how code links.
  6. fetch & error handlingTalking to APIs, parsing JSON, recovering from failure.
  7. TypeScript basicsTypes, interfaces, generics — TS without the tears.
  8. TypeScript advancedConditional types, infer, satisfies, and how libraries actually use TS.

Tooling

The boring stuff that pays for itself a hundred times over.

  1. Package managersnpm, pnpm, lockfiles, semver, and dependency hygiene.
  2. Git & GitHubBranches, PRs, rebase vs merge, the bare minimum to ship.
  3. BundlersVite, esbuild, Turbopack — what they do and when it matters.
  4. Linters & formattersESLint + Prettier — keep style off code review.
  5. Browser devtoolsNetwork, performance, console — the daily driver of debugging.

React

The library every frontend posting expects you to know.

  1. React basicsComponents, JSX, props, state — the model.
  2. React hooksuseState, useEffect, useMemo, useRef — and when not to.
  3. Lists, keys, reconciliationHow React decides what changed, and why your list key matters.
  4. Custom hooksExtracting reusable behavior. The composition pattern.
  5. Context & stateuseContext, lifting state, when to reach for Zustand or Redux.
  6. React RouterClient-side routing for non-Next apps.
  7. Forms in ReactReact Hook Form + Zod — controlled, validated, accessible.
  8. Server vs client componentsThe Next 14+ split, when each runs, and 'use client'.

Production

Ship it. Measure it. Fix it. Repeat.

  1. Next.js fundamentalsApp Router, layouts, server actions, the production frame.
  2. Data fetching patternsServer fetching, RSC payloads, SWR/TanStack Query — when to pick what.
  3. Core Web VitalsLCP, INP, CLS — the metrics Google + your users actually feel.
  4. Testing the frontendVitest + Playwright — unit, component, end-to-end, real.
  5. Deployment & CI/CDVercel, GitHub Actions, preview deploys, env vars done right.
  6. Monitoring & errorsSentry, Vercel Analytics, real-user metrics. Sleep at night.
  7. SEO basicsMeta tags, sitemaps, structured data, the shape Google needs.
  8. Working with AI toolsCopilot, Cursor, Claude Code — using AI without losing the fundamentals.

Beyond the basics

Optional depth + the actual job hunt.

  1. Design systemsTokens, primitives, shadcn/ui patterns, internal libraries.
  2. Advanced TypeScriptLibrary-grade TS — overloads, branded types, type-level work.
  3. Web standardsPWA, service workers, web components — beyond React.
  4. Accessibility auditsaxe, Lighthouse, manual screen-reader walks. Verify, don't assume.
  5. Get hiredPortfolio, resume, take-homes, interviews — the actual job hunt.

Outcomes

When you finish this track:

Schedule

~290 hours total.

At 8–10 hours a week, that’s about 6 months. Each stage has its own pace.

  1. Foundations5 nodes14–18h
  2. HTML4 nodes24–31h
  3. CSS5 nodes31–40h
  4. JavaScript8 nodes55–72h
  5. Tooling5 nodes23–30h
  6. React8 nodes52–68h
  7. Production8 nodes48–62h
  8. Beyond the basics5 nodes43–56h

Other tracks

Not what you wanted?

Backend

APIs, databases, auth, and shipping production services.

DevOps

Linux, Docker, CI/CD, cloud, and the on-call mindset.

AI / ML

Python, math foundations, models, and shipping ML in production.

Mobile

React Native or Flutter, native APIs, store deployment.

Full-Stack

Frontend + Backend depth, with the seams that connect them.