The dashboard as it stands after Phase 4 (modules inlined)
The preview cannot import your local files, so this example pastes config.js, format.js, clean.js, load.js and main.js into one module (the comments show where each file starts). In your project they are separate files. Change the DATA_URL line to "/data/lumn/" and run it to see the error box.
Turn the hand-typed dashboard into one that loads its own data: a config file, a loader, a cleaner, number formatting, a loading message, an error box and a row of key numbers. It answers Priya's question: can the dashboard read my exports even when they are messy?
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 5 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Add loadStatus() to load.js that fetches status.json, throws a clear error when stations is not a list, and returns the stations.
Add a sixth key number, "Rainy days", to main.js: the count of rows with rain_mm > 0.
Explain it without notes
Why does main.js keep the loading line in a finally block?
Why does load.js check the columns after parsing?
What changes in the code if the data moves to a bucket?
Preview
Console
Nothing logged yet.Expected console output
Loaded 365 days, 0 cleaning notes