Homework

Homework — one notify()

Homework — one notify().

  1. Create js/state.js with subscribe/notify, getState, loadFavorites/persistFavorites (with the guard) and toggleFavorite. In main.js, one subscribe() registration.
  2. Kill lesson 8's bug. Make sure no action calls renderGallery/Collection/Home directly — only notify(). Repeat lesson 8's scenario (save, remove from the collection, back to the gallery) — the ♡ is now correct.
  3. Persistence. Click a few ♡, reload the page — favorites remain. Open DevTools → Application → Local Storage and find the cosmos_favorites key with its JSON.
  4. Break storage. In Local Storage, hand-edit cosmos_favorites to invalid text (e.g. {{{). Reload — the app does NOT crash, it just starts from an empty list (the guard works).
  5. Extra: add removeFavorite(date) and confirm it only needs persistFavorites() + notify() — no view to mention.

Required tests:

  • One-click test: ♡ updates the gallery, collection and counter at once.
  • Persistence test: favorites survive a reload.
  • Guard test: corrupt JSON in storage doesn't kill the app.

To submit: screenshots: (1) ♡ updating everything from one click, (2) cosmos_favorites in DevTools, (3) the app working after corrupt JSON.

Next. We have tidy state with pub/sub. In lesson 10 we build the collection table: sortable columns, pagination and search — all reading getState() and subscribing. And we'll meet the sneaky Array.sort() trap.