Hands-on LabBeginnerPro

Build HTML Artifacts with Agents

Learn to turn plain-English requests into polished, self-contained HTML artifacts with a live AI agent in a real terminal. Across twelve lessons you build a personal gallery of deliverables (a profile card, a data table, charts, a one-page explainer, a dashboard, a comparison grid, an interactive planner, and a capstone of your own) while learning the request-inspect-refine loop that makes agents genuinely useful. No coding required. You describe, the agent builds, you judge the rendered result and steer.

12 labs

0 / 12 completed

Last updated: July 2026

Start labs

12 hands-on labs

Real workspace with file editing

Automated checkpoint grading

Free for a limited time

What you'll learn

Build real Agents you can ship

Practice prompting in a real workspace

Pass automated checkpoints to advance

Keep portfolio-ready projects when you finish

Labs in this course

12 labs

1
Your First Artifact
Lab 1 of 12
Open
2
Say What You Want
Lab 2 of 12
Locked
3
Markdown Versus HTML
Lab 3 of 12
Locked
4
Data as a Table
Lab 4 of 12
Locked
5
Charts and Diagrams
Lab 5 of 12
Locked
6
A One-Page Explainer
Lab 6 of 12
Locked
7
A Simple Dashboard
Lab 7 of 12
Locked
8
Compare Options in a Grid
Lab 8 of 12
Locked
9
An Artifact That Talks Back
Lab 9 of 12
Locked
10
Make It Yours
Lab 10 of 12
Locked
11
Design Like a Pro
Lab 11 of 12
Locked
12
Ship and Share Your Artifact
Lab 12 of 12
Locked

How labs work

Real workspace

Edit files and watch an Agent work alongside you.

Checkpoints

Automated checks confirm you've nailed each step.

Keep your work

Projects persist so you finish with something to ship.