Add svelte-stores and Cart

[silveltman]

Adding svelte-stores and integrating it with a cart from the shopify storefront API

[rroberrt]

If you import a store you can simply use the $store syntax to have Svelte create all the set(), unsubscribe() on destroy etc. for you. Referencing $store is (obviously) already reactive, and assigning a new value to $store is the same as calling store.set().

Stores are not persistent in Svelte, so to make them live past a browser session you'd have to fall back to localStorage. However, this is pretty easy to implement in the background.

You simply have to have a script somewhere that subscribes to the store and when the value changes, it saves the new value to localStorage in the callback.

I only have yet to figure out where to put that script.

[rroberrt]

Useful guide https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores

[silveltman]

If you import a store you can simply use the $store syntax to have Svelte create all the set(), unsubscribe() on destroy etc. for you. Referencing $store is (obviously) already reactive, and assigning a new value to $store is the same as calling store.set().

Stores are not persistent in Svelte, so to make them live past a browser session you'd have to fall back to localStorage. However, this is pretty easy to implement in the background.

You simply have to have a script somewhere that subscribes to the store and when the value changes, it saves the new value to localStorage in the callback.

I only have yet to figure out where to put that script.

Good point on $store VS set(), get(), subscribe(). The first options seems like a much simpler syntax.

[rroberrt]

Good point on $store VS set(), get(), subscribe(). The first options seems like a much simpler syntax.

https://svelte.dev/docs#component-format-script-4-prefix-stores-with-$-to-access-their-values