1 How the Web Works

  • Client vs Server
  • What happens when you open a website?
  • DNS, IP Address, HTTP/HTTPS
  • Browsers & rendering engines
MDN – How the Web Works

Best beginner-friendly explanation

2 HTML – Structure

  • HTML tags & elements
  • Head vs Body
  • Links, images, lists, tables
  • Forms & inputs
  • Semantic HTML

3 CSS – Styling

  • Selectors & properties
  • Box model
  • Flexbox & Grid
  • Responsive design

4 JavaScript – Interactivity

  • Variables & data types
  • Functions & events
  • DOM manipulation
  • Basic async (fetch)

5 Developer Tools

  • Browser DevTools
  • VS Code & Live Server
  • Basic Git & GitHub

6 Practice Resources

freeCodeCamp

Learn by building real projects

Frontend Mentor

Real-world frontend challenges

CodePen

Experiment with HTML, CSS, JS online

7 Beginner Projects

  • Personal portfolio website
  • Landing page
  • To-do list (HTML + JS)
  • Responsive blog page

🚀 What's Next

  • Backend fundamentals
  • Frameworks (React, Vue)
  • APIs & HTTP
  • Deployment (Netlify / Cloudflare)