Foundation
What every theme inherits from. Consistent across all CODED products.
- logoPlacementtop-left on title slides (fade-in 400ms)
- footerHeight64px
- footerLayoutsymbol bottom-left, page number bottom-right
- iconAnimationfloat 3s ease-in-out infinite
Product Themes
Each product has a unique palette + ambient identity, built on the same foundation.
Edit Theme Colors
Tweak the selected preset's palette. The layout library below re-renders as you type; hit Save to persist.
content/theme-presets/ai-app-developer/theme.json. Existing libraries keep their current theme until you re-apply this preset.Layout Library
All 21 slide types, rendered in AI App Developer. Click a preset above to swap the theme across every layout at once.
Build real tech skills
AI App Developer Bootcamp
Build real tech skills
From idea to prod in 5 days
Real shipping, real users, real feedback.
Day 1 · Session 01
Why this matters
Shipping is the skill we keep practicing. Everything else is preparation.
What would you build if you couldn't fail?
Two ways to start
Wait for the perfect plan
Stuck at the idea stage.
Ship the ugly version Friday
Real users, real feedback, real progress.
Ship daily
Fix in prod
Measure impact
Stay focused
Pair up
Learn forever
87%
of students ship in week one
across every cohort since 2023
Three moves that unblock you
Name the failure in one sentence
Reproduce it with the smallest possible test
Ship the fix as a single commit
Every bug, every time.
Live demo
Let's wire up an API in 60 seconds.
Your first API call
15 minutes · solo · check in when done
Install the SDK
pnpm add @anthropic-ai/sdk
Set your key
Add ANTHROPIC_API_KEY to your .env.
Ship a request
One function, three lines, real response.
Stuck? Drop a 🆘 in the channel.
Today you learned to
Bring questions tomorrow
Build real tech skills
Up Next
Day 2 · The API layer
Your five-week journey
Week 1
Foundations
Ship your first app
Week 2
APIs
Talk to other services
Week 3
AI
Wire up Claude end-to-end
Week 4
Polish
Make it feel real
Week 5
Launch
Ship to the world
Pick the right tool
Brute force
Ship fast, fix later
Good for prototypes
Careful craft
Design first, build second
Slow start
Balanced
Ship + iterate in tight loops
Most of the time
%22%2F%3E%3Cg%20fill%3D%22white%22%20opacity%3D%220.5%22%20font-family%3D%22monospace%22%20font-size%3D%2232%22%20text-anchor%3D%22middle%22%3E%3Ctext%20x%3D%22600%22%20y%3D%22400%22%3E%5B%20image%20%5D%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fsvg%3E)
The tools change. The craft doesn't.
Build in public
Day 1 · Principle 03
The fastest way to learn is to ship something that barely works, then fix it in front of real users.
— CODED teaching principle
Break time
Stretch, hydrate, come back ready.
The API layer
From local scripts to real services
Slide Simulator
Pick a layout, inspect its variables and types, then edit the JSON to see the slide render live. Nothing saves — this is for testing only.
- pillTopRight?string
- headingstring (2 rows)
- marqueeItems?string[]
Build real tech skills
Shared Components
Logo placement, footer, page number, and icon animation — identical across every theme.
Official Sponsors
The canonical list rendered by the Sponsors slide layout. Edits here sync across every deck on the next load. Each sponsor supports default / white / black variants — the slide picks the right one for the surface.
Brand Elements Lab
Toggle dark/light mode and mix the brand graphics (edge notch, lines frame, bracket fade, dot grid, concentric circles, gradient wash) to see how they compose on a slide. Each element has a stable id — reference it to apply that element to a specific slide layout.
Canvas is 1920×1080 (the slide native size) rendered at ~35% scale. Every element is positioned in canvas coordinates, so what you see here is exactly how it will land on a real slide.