Web development has more paths and more jargon than any other beginner route. This roadmap is one sensible order. It is not the only one, and you can stop at any point and still be able to build useful things.
For the wider picture of how the web fits together, read web development for beginners first.
Stage 1 — The page itself (2–4 weeks)#
Goal: a multi-section page that looks reasonable on a phone.
- HTML basics — structure, links, images, forms
- CSS basics — selectors, the box model, flexbox, grid
- Responsive design — make it work on a phone
- Build: a portfolio page
Stage 2 — Making it interactive (6–10 weeks)#
Goal: a page that responds to the person using it.
- JavaScript fundamentals
- The DOM and events
- Async/await and fetch
- Build: a to-do app and a quiz app
Stage 3 — Tools and shipping (1–2 weeks)#
Goal: a public link you can send someone.
- Git and GitHub
- DevTools and debugging
- Deploy with GitHub Pages or Netlify — both free
Stage 4 — Choose a direction#
Now the paths split. Pick based on what you want to build.
Front end#
A framework such as React or Vue, component thinking, and a build tool. Only after plain JavaScript is comfortable — see front-end development.
Back end#
A server language and framework (Node with Express, or Python with Flask or Django), databases and SQL, authentication, building your own APIs. See back-end development.
Both#
See full-stack development for how the two halves meet.
What to skip until you need it#
Every one of these solves a problem you have not met yet:
- TypeScript — after JavaScript is comfortable
- Docker and Kubernetes — deployment concerns, not learning concerns
- GraphQL — after you have built a normal REST API
- Webpack and build configuration — modern tools handle it
- Server-side rendering, micro-frontends, state-management libraries
How long does this take?#
With consistent practice — an hour most days — Stages 1 to 3 are commonly a few months. Anyone quoting you an exact number is guessing, and how fast you move matters far less than whether you keep going.
Begin stage oneStart with HTML basics