The Frontend Engineer trek
HTML, CSS, JavaScript, TypeScript, React, Next.js, testing, performance, and accessibility. Every skill a frontend engineer needs to build production web applications.
HTML & semantic structure
Semantic HTML5, the accessibility tree, forms, and the document model that CSS and JavaScript operate on. Get this right and everything else is easier.
CSS fundamentals to mastery
The box model, Flexbox, CSS Grid, the cascade, custom properties, animations, and responsive design. CSS is a layout system — understand it as one.
Modern JavaScript
ES2024, closures, the event loop, Promises, async/await, the module system, and the DOM APIs that make interactive UIs possible.
TypeScript
Types, generics, utility types, and the TypeScript config that balances strictness with developer experience. TypeScript is the industry default — be fluent in it.
React fundamentals
Components, props, state, hooks, and the mental model that makes React understandable. Learn what React actually does before you reach for abstractions.
State management & advanced React
useReducer, Zustand, React Query, concurrent features, and when to reach for global state vs server state vs URL state.
Next.js & full-stack React
App Router, Server Components, server actions, data fetching, ISR, and shipping a production Next.js app that's fast by default.
Testing frontend applications
Unit tests, integration tests, end-to-end tests, and the testing pyramid that catches bugs before users do.
Web performance optimization
Core Web Vitals, the rendering pipeline, bundle analysis, image optimization, and the techniques that actually move real-user metrics.
Accessibility deep dive
WCAG 2.2, ARIA patterns, keyboard navigation, screen reader testing, and building interfaces that work for everyone.
Build tooling & developer experience
Vite, ESLint, Prettier, CSS preprocessors, monorepos, and the toolchain that makes a team productive.
Capstone — ship a production frontend
Build, deploy, test, and document a production-quality frontend application. Real users, real performance budget, real accessibility requirements.
Trek complete. What's next?
You've walked the full roadmap. Now ship the capstone, write about it, and share the path with the next engineer who needs it.