Code

main.js — views subscribe themselves

All that's left is to subscribe. In the code column — main.js with a single subscribe() registration. That's the whole trick: one place, set up once, replaces all the scattered manual re-renders from lesson 8.

subscribe(() => {
  render();              // the gallery
  renderCollection();    // the collection (placeholder until lesson 10)
  renderHome();          // the nav counter
});

Compare the path:

LESSON 8:  each action → renderGallery() + renderCollection() + renderHome()
           (and forget one → the silent lie)

LESSON 9:  each action → notify()
           notify() → the one subscribe() → whatever's needed re-renders

The difference is fundamental: actions no longer know about views. toggleFavorite, removeFavorite, updateFavorite — all end in notify() and never mention renderGallery. One place wires the views. There's nothing to forget.

Verify.

1. Click ♡ in the gallery → the card fills, the nav counter rises, the collection updates — from ONE click.
2. Reload the page → favorites are STILL there (localStorage).
3. Remove from the collection → go back to the gallery, the ♡ is already empty. The lie is GONE.

Gotcha (localStorage is strings only). localStorage stores only strings. An object needs JSON.stringify to write and JSON.parse to read. Forget it and you get "[object Object]" instead of data. And remember the guard: JSON.parse throws on corrupt text, so reads are always inside try/catch.

Notice. From this lesson on, every feature (the collection, forms, modals) will only read getState() and call notify(). There will be no more manual re-renders — for the rest of the course.