Spark

Become an engineer

Most designers can prompt their way to an app. But, few can start from an empty file. That's what this course is for.

19 modules ·5 phases ·no prior code needed

+ Start hereMake a real file yoursSection 1 of 11 · 9 minBegin

+ Phase 0 · Foundations

5 modules
01Make a real file yoursRead every line of a real shipped file and say what it does and why.9 min02How the web runsKnow what happens between saving a file and seeing it in a browser.7 min03HTML, the languageHand-write semantic, accessible HTML, and start designing in the browser.9 min04CSS as a systemBuild responsive layouts and fluid type without a framework.17 min05CSS CraftRecreate a real design pixel for pixel, then add one transition that earns its place.5 min

+ Phase 1 · JavaScript and React

5 modules
06JavaScript fundamentalsSolve UI problems in plain JavaScript.14 min07Intermediate JavaScript: Fetch and Real DataFetch and work with real data in the UI.9 min08TypeScript for UIType component props and data confidently.3 min09React FundamentalsBuild a small React app and reason about state8 min10Testing React UIWrite the test before the component, then refactor without fear of breaking it.9 min

+ Phase 2 · Design engineer core

4 modules
11Design Systems in CodeTurn a design system into a coded, themed component library. Move tokens both directions and build components that designers and engineers both respect.11 min12Motion & Interaction EngineeringBuild motion that communicates, and know when to leave it out.12 min13Shipping UI, Next.js + Desktop/ElectronShip a real Next.js app to a live domain, and know what runs where.23 min14Designing AI-native interaction patternsInvent interaction patterns for AI products where no precedent exists.10 min

+ Phase 3 · Full stack

4 modules
15Data & APIs in depthDesign and build the endpoint that powers your own interface.9 min16Databases & ORMStore data that survives a restart, and read the SQL running underneath.10 min17Auth: Gating Pages Behind LoginGate something behind login and understand sessions vs. tokens.5 min18Professional Practice & DeployWork the way an engineer on a team works: branches, reviews, and deploys.16 min

+ Phase 4 · Capstone

1 modules
19CapstoneDesign, build, and deploy one polished product integrating tokens, motion, AI, and accessibility. Your portfolio piece.24 min