← Courses
CS 460 · 3 credits
Course Outline
Web Development Fundamentals
Learn how the web actually works and build real pages from scratch. Starting from zero HTML and CSS, you will structure content with semantic markup, style it with modern CSS (the box model, flexbox, grid, responsive design), and connect the JavaScript you already know to live pages through the DOM and events. Every concept comes with something to run or build in the browser, and the course ends with a complete landing page plus a working form validation flow.
What you will learn
- ✓Explain what happens between typing a URL and pixels appearing, and what HTML, CSS, and JavaScript each do
- ✓Structure any page with semantic HTML: headings, lists, links, images, tables, and accessible forms
- ✓Style pages with confidence using selectors, the cascade and specificity, the box model, and modern units
- ✓Build real layouts with flexbox and grid, and make them responsive with media queries and clamp()
- ✓Use JavaScript in the page: load scripts correctly, select and change DOM elements, and handle events
- ✓Debug any page with DevTools and ship a complete landing page with client-side form validation
Course outline
Unit 1How a Web Page Works
- 1-1Three languages, one page2 checks · 8 min
- 1-2From URL to pixels: the browser as renderer2 checks · 9 min
Unit 2HTML I: Structure and Content
- 2-1Your first HTML page2 checks · 9 min
- 2-2Headings, paragraphs, and lists2 checks · 8 min
- 2-3Links and images3 checks · 8 min
- 2-4Emphasis, comments, and special characters2 checks · 8 min
Unit 3HTML II: Forms, Tables, and Semantics
- 3-1Forms and inputs3 checks · 10 min
- 3-2Tables3 checks · 7 min
- 3-3Semantic layout and accessibility1 checks · 9 min
Unit 4CSS I: Selectors, Colors, and the Cascade
- 4-1Your first stylesheet2 checks · 9 min
- 4-2Colors and typography3 checks · 8 min
- 4-3The cascade and specificity3 checks · 10 min
- 4-4States: hover, focus, and pseudo-classes2 checks · 9 min
Unit 5CSS II: The Box Model
- 5-1Every element is a box3 checks · 9 min
- 5-2display and box-sizing3 checks · 8 min
- 5-3Units: px, %, em, rem, vw and vh4 checks · 8 min
- 5-4position: pinning and layering2 checks · 10 min
Unit 6Layout with Flexbox
- 6-1The flex mental model: main and cross axis2 checks · 9 min
- 6-2Aligning and distributing2 checks · 9 min
- 6-3Build a real navbar, step by step2 checks · 8 min
Unit 7Grid and Responsive Design
- 7-1CSS grid basics3 checks · 9 min
- 7-2Media queries and mobile-first3 checks · 9 min
- 7-3Fluid sizing with clamp4 checks · 8 min
Unit 8JavaScript in the Page: The DOM
- 8-1Script tags and the DOM tree3 checks · 9 min
- 8-2Selecting and changing elements2 checks · 9 min
- 8-3Events4 checks · 9 min
- 8-4Creating elements from data2 checks · 10 min
Unit 9DevTools and the Capstone
- 9-1DevTools: inspect, computed styles, console3 checks · 8 min
- 9-2Capstone I: structure and style the landing page2 checks · 12 min
- 9-3Capstone II: form validation walkthrough4 checks · 12 min
Practice while you learn
Use Hack University's public online code editor when you want to run code online before committing to the full curriculum. The browser compilers are free for quick syntax checks, exercises, and interview practice in an isolated sandbox environment.