Frontend Developer
From semantic HTML and CSS mastery to modern React/Next.js, performance optimization, and web vitals.
1. Beginner
Core mental models of the web and browser execution environment.
Semantic HTML5 & Accessibility
Document outline, landmarks, forms, ARIA roles, WCAG compliance.
CSS Box Model & Specificity
Margins, padding, border-box, cascade, specificity score.
2. Foundation
Modern CSS layouts and JavaScript language fundamentals.
Flexbox & CSS Grid Mastery
1D vs 2D layout paradigms, subgrid, responsive container queries.
JavaScript Core (ES6+)
Prototypes, closures, scope chain, event loop, fetch API, promises.
3. Core Skills
Type safety, version control, and module bundling.
TypeScript for Frontend
Generics, union types, discriminated unions, utility types, strict mode.
Git Workflow & Collaboration
Branching strategies, interactive rebasing, merge conflict resolution, CI integration.
4. Framework
Modern component-driven development and state management.
React 19 & Component Architecture
Hooks, reconciliation, fibers, server components, suspense.
Next.js (App Router)
Server/Client components, SSR, SSG, streaming, server actions.
5. Real Projects
Ship full-fledged projects with state, auth, and backend integrations.
Interactive Kanban Board
Drag and drop, local persistence, offline optimistic updates.
Headless E-Commerce Storefront
Faceted search, cart sync, checkout flows, image optimization.
6. Advanced
Performance auditing, micro-frontends, and build tooling.
Web Vitals & Performance Engineering
LCP, INP, CLS optimization, bundle analysis, tree-shaking, code splitting.
Frontend Security
XSS prevention, CSRF defenses, Content Security Policy (CSP), token storage.
7. Interview Prep
Technical screen coding, system design for frontend, behavioral.
Frontend Coding Challenges
Debounce/throttle polyfill, deep clone, virtualized list, event emitter.
Frontend System Design
Designing Google Docs, Figma canvas, news feeds, autocomplete widget.