Learn web development in this order: how the web works, HTML, CSS (including Flexbox, Grid and responsive design), JavaScript, Git and GitHub, a front-end framework like React, back-end basics with Node.js or Python, databases and SQL, deployment, and AI-assisted development. Build projects at every stage and publish them in a portfolio.
Stage 1: How the web works (week 1)
Understand browsers, servers, URLs, DNS, HTTP and hosting. See how websites work.
Stage 2: HTML (weeks 1 to 2)
Semantic structure, forms, accessibility basics. See HTML and CSS explained.
Stage 3: CSS (weeks 2 to 5)
Box model, typography, colour, Flexbox, Grid, responsive design and simple animations.
Project: a responsive personal profile page.
Stage 4: JavaScript (weeks 5 to 12)
Variables, functions, arrays, objects, DOM, events, fetch and async. See JavaScript for beginners.
Projects: to-do list, quiz, weather app.
Stage 5: Git and GitHub (alongside stage 4)
Commits, branches, pull requests and a public profile. See Git and GitHub for beginners.
Stage 6: A front-end framework (months 3 to 5)
React is a common choice. Components, state, routing and data fetching. See React for beginners.
Project: a multi-page app using a public API.
Stage 7: Back end and databases (months 5 to 7)
Node.js with Express, or Python with a framework; REST APIs; authentication; SQL databases. See SQL for beginners.
Project: a full-stack app with login and a database, such as a booking system.
Stage 8: Deployment and quality (month 7 onwards)
Hosting, environment variables, performance, security basics, testing, SEO and accessibility.
Stage 9: AI-assisted development
Use AI coding assistants effectively and add AI features through APIs. See how to use AI coding assistants.
Stage 10: Portfolio and work
Three to five polished projects, a portfolio website, GitHub and applications or freelancing.
Timeline summary
| Stage | Approximate time with steady practice |
|---|---|
| Foundations (HTML, CSS, JS) | 3 months |
| Framework and Git | 2 months |
| Back end and databases | 2 months |
| Deployment, AI and portfolio | 1 to 2 months |
Timelines vary with hours invested. Our web development course follows this roadmap with a developer guiding and reviewing every project.
Frequently asked questions
Can I skip HTML and CSS and go straight to React?
No. Weak HTML and CSS foundations cause problems later in every project.
Do I need a back end for every project?
No. Many sites are static. Back ends are needed for user accounts, stored data and business logic.
Should I learn TypeScript?
Yes, after JavaScript basics. See why learn TypeScript.
