Respond to an event

15-minute session: read for 3 minutes, trace for 3, experiment for 7, and complete the check for 2. Spend longer whenever you need.

JavaScript changes behavior. The listener waits for a click, updates done, and renders the new text. Predict the display after three clicks. Add a reset button that updates both state and the visible count. Reload the preview: this counter is memory in a page, not a saved account record.

<!doctype html>
<html lang="en"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>Agila study</title>
<main><h1>Study counter</h1><button id="add">Complete one</button><p id="count" aria-live="polite">0</p></main>
<script>let done=0;document.getElementById("add").addEventListener("click",()=>{done+=1;document.getElementById("count").textContent=String(done);});</script></html>

Practice and evidence

Keep three notes: your prediction, the actual result, and why they match or differ. The completion check grades understanding; the practice task builds skill.