Mission 1 of 12 · Updated November 2026

Build an Interactive Personal Website

Start from zero. Learn how browsers, websites and servers fit together, then build your own personal website with HTML and CSS and bring it to life with JavaScript - variables, conditionals, loops and functions. Run the same JavaScript in the browser and in Node.js.

By the end of this mission: “I can build an interactive web page with HTML, CSS and JavaScript, and explain how the browser runs my code.”

The tech stack for this mission

HTML5 logoHTML5CSS3 logoCSS3JavaScript logoJavaScriptNode.js logoNode.jsChrome DevTools logoChrome DevTools

What you learn, checkpoint by checkpoint

  1. Checkpoint A

    Structure and style your site with semantic HTML and CSS

    • How websites, browsers and servers work together when you open a page
    • Structure content with semantic HTML - headings, sections, images and links
    • Style it with CSS fundamentals - colours, spacing, the box model and simple layout
  2. Checkpoint B

    Add interactivity with variables, conditionals, loops and functions

    • Store and change data with variables, data types and operators
    • Make decisions with conditionals and repeat work with loops
    • Package logic into functions and wire them to clicks and inputs on the page
  3. Checkpoint C

    Run JavaScript in Node.js and debug it in Chrome DevTools

    • Run JavaScript outside the browser with Node.js and npm
    • Find your way around the terminal and VS Code
    • Inspect elements, read console errors and step through code in Chrome DevTools

AI companion mode · AI as Tutor

Most guidance · you still write first

Companion explains concepts, walks you through setup, and reviews your code. You still write the first draft and must explain what you shipped.

What proves you’re done

Working interactive personal website + walkthrough explaining your JavaScript

Every mission ships something real you can show. If you can’t explain it, you can’t submit it.

Deliberately left out of this mission

CSS frameworks · Advanced layouts · TypeScript · Computer science theory

Depth is set on purpose: you master what this mission needs, not everything at once. The advanced material lives in optional self-study after Mission 12.

Free · no card needed

Reading is not building.

This mission is part of the paid 12-week programme - but the way we teach is free to try. The free trial puts you inside Sigmo, the learning portal our students use daily, with the 6 Projects in 6 Days precourse: real projects, real code, published to your own GitHub.

Start the free trial

Ready for the real thing?

The AI-Native Software Development Programme - all 12 missions with a live cohort, daily Buildroom, and mentors watching your back.