4

Phase 4 · 3–4 months

Web basics

Now you make things people can actually SEE in a web browser. We use the plain building blocks first — no shortcuts yet, so you really understand how the web works.

What to learn

  • HTML (= gives a web page its bones — the headings, text, buttons, forms).
  • CSS (= the paint and layout — colours, spacing, and making it look good on a phone too). This "looks good on any screen" idea is called responsive design.
  • JavaScript (= makes the page DO things when you click or type). You’ll meet the DOM (= the live page that JavaScript can change) and async code (= code that waits for slow things, like the internet, without freezing the page).

Practice on your own

  • Build a simple recipe page.
  • Make 3 cards sit side by side (try Flexbox, then Grid).
  • Add a button that switches between dark and light colours.
  • Pull a joke from a free API (= a way for two programs to share data) and show it on the page.

Build this

Your own portfolio website (about you), with one fun interactive thing, put online for free with GitHub Pages. To deploy (= put your work on the internet for anyone to see) — that is a big, exciting moment. Your first thing on the real web!
Move on when: You can build a small web page from scratch and put it online with a real link you can share.