Frontend Engineering Roadmap
Complete frontend path from roadmap.sh
The definitive frontend roadmap from roadmap.sh. Covers HTML/CSS, JavaScript, frameworks, build tools, testing, accessibility, and performance optimization.
Front EndFreebeginner16 weeks
Submitted by @kiraRoadmap (6 steps)
1
HTML & CSS Foundations
3 weeks#Semantic HTML#CSS Selectors & Box Model#Flexbox & Grid#Responsive Design
2
JavaScript Core
4 weeks#ES6+ Syntax#DOM Manipulation#Async/Await & Promises#Modules & Bundlers
3
Version Control & Package Managers
2 weeks#Git & GitHub#npm/yarn/pnpm#Semantic Versioning#Monorepos
4
CSS Frameworks & Preprocessors
2 weeks#Tailwind CSS#SASS/SCSS#CSS Modules#Styled Components
5
Testing & Build Tools
2 weeks#Vite/Webpack#ESLint & Prettier#Jest/Vitest#Cypress/Playwright
6
Capstone Project
3 weeksBuild a responsive web application using modern CSS, JavaScript tooling, testing frameworks, and performance optimization.