Course A · Module A4 Build · Lesson 15 of 17

Reading Code Without Fear

You don't need to write code to be powerful. You need to read just enough to find the part you want to change.

~14 min · Have your built app from A14 open · No writing code yet

You just built and shipped a real app by describing it. Amazing — and also the moment most non-technical founders get stuck. You asked for a change, the AI rewrote something, and now a button's broken and you have no idea why. That's comprehension debt: you own software you can't read. This lesson is the antidote. Your single win: by the end you'll open the code your AI generated, and instead of panic, you'll think "ah — the part I want is probably right here." That's the whole skill. Not writing. Locating.

Code is just labeled instructions

Imagine a recipe card. You don't need to be a chef to read one — you can scan it and point at "this is the ingredients, this is the oven temperature, this is the step where it goes wrong." Code is the same: labeled instructions a computer follows top to bottom. Scary-looking, but readable.

Your job isn't to cook from scratch. It's to find the line that says "350°F" when the cake's burning, and change it.

The three rooms of a typical app

Almost every small web app the AI builds you has three kinds of files. Learn these three words and the folder stops being a wall of mystery:

.htmlThe structure — what's on the page (headings, buttons, boxes).

.cssThe style — how it looks (colors, fonts, spacing).

.jsThe behavior — what happens when you click (the logic).

Broken color or layout? Look in CSS. Wrong words or a missing button? HTML. Click does nothing or the wrong thing? JavaScript. That single triage rule will route you to the right file 90% of the time.

Reading a snippet — out loud, in plain English

Here's a real button from a generated app. Don't decode every symbol. Read it like the recipe card — find the nouns and the verbs:

<!-- HTML: the structure -->
<button id="draftBtn">Draft this email</button>

// JavaScript: the behavior
when someone clicks "draftBtn":
    message = "Write a friendly reminder about an overdue invoice"
    send message to the AI
    show the reply on the page

You just read code. The button is labeled draftBtn; the behavior block says when that button is clicked, send this message to the AI and show the reply. Want a warmer email? You can see exactly which line of text to change — the one in quotes. That's the win. You don't edit blind; you edit the line you found.

The golden move: when the AI hands you code, ask it "explain this file to me in plain English, line by line, like I'm not a programmer." Reading with the AI as your translator is the fastest way to build real comprehension — and it's free.

Your 4-step "find the part" method

When you want to change something:

Name what you see. Is it a look, a word, or a behavior? → picks the file (CSS / HTML / JS).
Search for the words. Use Find (Ctrl/Cmd-F) for text you can see on screen — like the button's label. It lives right next to the code you want.
Read that bit out loud in plain English (ask the AI to translate if stuck).
Change one thing, then look. One change at a time, then refresh and check. Never change five things at once.

Notice this is the same posture as everything else in this course: small step, look at the result, adjust. A tight feedback loop beats understanding everything up front.

Check yourself

Answer before opening — recalling it is what makes it stick.

Your app's "Submit" button is bright green and you want it blue. Which file?

CSS. Color is how it looks — that's style. The structure and behavior don't change at all.

The button text should say "Generate" but reads "Genrate". Which file?

HTML. The words on the page are part of the page's structure/content. Find the typo, fix the one word.

Clicking "Draft" does absolutely nothing. Best first move?

Look in the JavaScript — and ask the AI to explain it. A click that does nothing is a behavior problem. Don't guess across the whole project; route to JS and have the AI translate the relevant block.