Solice UI
Open workspace

Frontend curriculum

Understand how the frontend works.

A plain-language guide to the ideas, languages, and behaviors that power modern websites. Start anywhere, build confidence, and go deeper at your pace.

Start with the basics

  1. 01

    How the Web Works

    From a typed address to visible pixels. Follow the simple journey behind every page.

    1. 1.1HTTP and browsers
    2. 1.2URLs and navigation
    3. 1.3DNS, domains, and servers
    4. 1.4Request-response lifecycle
    5. 1.5Rendering the first page
    6. 1.6Cookies and browser storage
  2. 02

    HTML & Semantics

    Describe the page's meaning and structure before deciding how it should look.

    1. 2.1Documents and elements
    2. 2.2Semantic structure
    3. 2.3Headings and lists
    4. 2.5Forms and validation
    5. 2.6Metadata and page titles
  3. 03

    CSS & Layout

    Style with intention and build layouts that adapt without hiding the document's meaning.

    1. 3.1Selectors and cascade
    2. 3.2Box model and spacing
    3. 3.3Color and typography
    4. 3.4Normal flow and positioning
    5. 3.5Flexbox and Grid
    6. 3.6Responsive design
  4. 04

    JavaScript & the DOM

    Add behavior with small pieces of JavaScript and understand what they change on the page.

    1. 4.1Variables and data types
    2. 4.2Conditionals and loops
    3. 4.3Functions and scope
    4. 4.4Arrays and objects
    5. 4.5The DOM and events
    6. 4.6Async requests and updates
  5. 05

    Accessibility & Interaction

    Build clear, predictable experiences that more people can perceive and operate.

    1. 5.1Keyboard and focus
    2. 5.2Semantic roles and labels
    3. 5.3Accessible forms and errors
    4. 5.4Images and alternative text
    5. 5.5Motion and contrast
    6. 5.6Clear content and feedback
  6. 06

    Performance & Tooling

    Keep sites fast and reliable with practical browser, version-control, and delivery habits.

    1. 6.1Rendering and reflow
    2. 6.2Images and assets
    3. 6.3Caching and delivery
    4. 6.4Browser DevTools
    5. 6.5Git and small changes
    6. 6.6Builds and environments

Quick explanations

Short answers to common frontend terms.

Hydration

Attaching browser-side behavior to HTML that was already rendered.