How AI Coding Assistants Work
14 minIntermediateHTML · CSS · JS
In this lesson
- ▸Explain, at a conceptual level, how a language model produces code from your prompt
- ▸Know what an assistant can and can't see (its context) and when it can actually run code
- ▸Spot and fix a confident-but-wrong suggestion by running it and reading the error
The big idea
A coding assistant predicts code that is likely to fit your request. Likely is not the same as correct — running and reading the code is how you find out.
You've probably asked Claude Code, Codex, GitHub Copilot or a chat assistant for code, pasted the answer, and hoped. This track is about replacing hope with understanding. It starts with a simple, honest mental model of what the assistant is doing.
Predicting text, one piece at a time
At the core of every coding assistant is a large language model (LLM). During training it learned statistical patterns from a huge amount of text, including a lot of code. When you send a prompt, it generates a reply by repeatedly predicting a likely next piece of text (a token) given everything currently in its context. This is a simplification, but it's the right one to keep in your head.
That's why generated code usually looks very plausible: it resembles the code that typically follows requests like yours. But plausible-looking code can call functions that don't exist, use an option from an old version, or miss the one edge case your app depends on.
- Context window
- Everything the model can "see" in one go: your prompt, earlier messages, files or tool output that were added. It has a size limit. Anything outside it, the model doesn't know about.
- Training cutoff
- The model learned from data up to some point in time. Newer library versions or changed APIs may be missing unless they're provided in the context (for example by pasting the docs).
- Tools / agent
- Some assistants (for example Claude Code or Codex) can be given tools: read files, run commands, run tests. Without tools, a model only produces text — it hasn't run anything.
- Hallucination
- A confident answer that isn't true: a made-up method, package, flag or fact. It reads exactly like a correct answer, which is what makes it dangerous.
What this means in practice
- It only knows what's in its context. If it never saw your
utils.js, any code that uses it is a guess. - "This works" in a chat reply is not evidence. Unless a tool actually ran the code and you can see the output, nothing was tested.
- It can be confidently wrong. Tone tells you nothing about correctness. Treat every suggestion as a draft from a fast, well-read colleague who never double-checks.
- Answers vary. Ask the same thing twice and you may get different code. Your tests, not the wording, decide which one is right.
- You stay responsible. Whatever you commit, deploy or paste into a terminal is yours.
What the assistant wrote
function totalPrice(items) {
return items.sum((item) => item.price);
}What a reviewer ships
function totalPrice(items) {
return items.reduce((sum, item) => sum + item.price, 0);
}JavaScript arrays have no sum() method. It reads naturally — some other languages and libraries have one — so it's an easy thing for a model to predict. Running it shows the truth immediately.
Could not render the cart: TypeError: items.sum is not a functionErrors are your friend: this one names the exact thing that doesn't exist. (The generated code wraps rendering in try/catch and logs the error — good. A catch that swallows errors silently would hide the bug.)
WANCode doesn't call an AI
The "generated" code in this track is written for teaching, in the style assistants commonly produce. Everything runs in your browser — the skill you're practising is reading, running and verifying.
The loop for this whole track is read → run → verify → decide. Read the code until you could explain it. Run it. Verify it against what you actually need. Then decide: keep, fix, or ask again with better context.
The preview shows RM 0.00 and the console shows an error. Read the error, then fix totalPrice(items) in script.js so it really adds up every item's price. It must also return 0 for an empty cart.
Don't rewrite the whole file — change only what's wrong.
Checks
- totalPrice adds up the prices
- An empty cart totals 0
- The page shows RM 9.50
Check understanding
What you learned
- ✓An LLM generates code by predicting likely text from its context — plausible is not the same as correct.
- ✓It only knows what's in its context window, and it only runs code when it has tools to do so.
- ✓Error messages like
x is not a functionoften point straight at a hallucinated API. - ✓Read → run → verify → decide. You are responsible for what you ship.
Console output from your code appears here.