Not all application state belongs to the application's component hierarchy. Sometimes, you need to have some values accessed by multiple unrelated components or regular JavaScript modules.

In Svelte, we use stores to do this. A store is simply an object with a subscribe method that allows interested parties to be notified when the store value changes. In App.svelte, count is a store and we are setting the count_value callback count.subscribe.

Open stores.js to see the definition count. It is a writable store, which means that in addition to that, it has sets and methods. updatesubscribe

Now, connect + button in Incrementer.svelte:

function increment() {
	count.update((n) => n + 1);
}

Clicking the + button should now update the count. Do the opposite on Decrementer.svelte.

Finally, reset.svelte implements reset in:

function reset() {
	count.set(0);
}