Basic JavaScript: from first instruction to an event finder

Audience and entry check

For learners who can read a basic HTML page, connect a CSS file, use labels and identify an element with a selector. No programming experience assumed. Before starting, create a heading, a labeled input and a button; explain the difference between an element and a selector. If those tasks are unfamiliar, finish the companion HTML/CSS course first.

Outcome

Build and explain a browser-native fictional event finder with filtering, safe text rendering, accessible native controls, a local practice form, asynchronous fixture loading and a small saved-ID preference. This is a frontend foundation, not a real registration service.

Learning sequence

• Module 01: Make the browser follow your instructions. Provisional 75 minutes including reading and practice. Output: exercise 01 evidence.

• Module 02: Represent information with values. Provisional 90 minutes including reading and practice. Output: exercise 02 evidence.

• Module 03: Choose a path and repeat a task. Provisional 90 minutes including reading and practice. Output: exercise 03 evidence.

• Module 04: Turn a rule into a function. Provisional 100 minutes including reading and practice. Output: exercise 04 evidence.

• Module 05: Model events with arrays and objects. Provisional 100 minutes including reading and practice. Output: exercise 05 evidence.

• Module 06: Connect data to the page with DOM events. Provisional 100 minutes including reading and practice. Output: exercise 06 evidence.

• Module 07: Check practice forms without sending data. Provisional 100 minutes including reading and practice. Output: exercise 07 evidence.

• Module 08: Organize modules and debug with evidence. Provisional 90 minutes including reading and practice. Output: exercise 08 evidence.

• Module 09: Wait for data with promises and fetch. Provisional 110 minutes including reading and practice. Output: exercise 09 evidence.

• Module 10: Remember small choices and finish the event finder. Provisional 100 minutes including reading and practice. Output: exercise 10 evidence.

How time estimates should be used

The ten lesson blocks total about 16 hours, plus 3–5 hours for the independent capstone and review. Allow roughly 19–21 hours overall, with breaks and setup time as needed. These are planning estimates, not measured completion times or a promise. A beginner pilot should calibrate them before using them in scheduling or marketing. Learners may repeat a lesson without being “behind.”

Assessment and support

Each module has a prediction, a repair task and a less-guided transfer task. Early tasks specify more steps; later tasks specify outcomes and evidence. Attempt the task before consulting its separately linked solution. Move on when you can explain why your code works, not only reproduce the output. The capstone includes a 20-point rubric, required failure cases and a short explanation interview.

Use the Console, Network panel and a one-change-at-a-time debugging record. Pair discussion is encouraged: the observer predicts while the driver runs the program, then swap roles. Accessibility, safety and honest interface wording are assessed as behavior, not as optional polish.

Scope boundaries

No React, TypeScript, package installation, bundler, backend, authentication, real email, payment or live publication. Node is optional for instructor tests only. Dates and capacities are fixed fictional fixtures. The course uses current stable browser features without requiring experimental flags. The source register records primary references checked on 2026-10-14.