Writable stores in Svelte - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a writable store in Svelte?

A writable store is a special object in Svelte that holds a value you can read and change. It lets components share and react to data changes easily.

beginner

How do you create a writable store in Svelte?

Use the <code>writable</code> function from <code>svelte/store</code>. For example: <br><code>import { writable } from 'svelte/store';<br>const count = writable(0);</code>

beginner

How do you update the value of a writable store?

You can use the set method to replace the value or the update method to change it based on the current value. <br>Example: <br>count.set(5);<br>count.update(n => n + 1);

beginner

How do components react to changes in a writable store?

Components subscribe to the store. When the store value changes, subscribed components automatically update their displayed data.

intermediate

What is the difference between subscribe and set in writable stores?

subscribe lets you listen to changes in the store value. set changes the store value. <br>Subscribe is for reading/reacting, set is for writing.

Which function creates a writable store in Svelte?

A store()

B readable()

C writable()

D derived()

The writable() function creates a store you can both read and write.

How do you change the value of a writable store?

A Using set() or update() methods

B Using subscribe() method

C Directly assigning a new value

D Using get() method

set() replaces the value, update() changes it based on current value.

What does the subscribe() method do in writable stores?

A Creates a new store

B Changes the store value

C Deletes the store

D Listens for changes in the store value

subscribe() lets components react when the store value changes.

Which import is needed to use writable stores in Svelte?

A import { writable } from 'svelte/store';

B import { writable } from 'svelte';

C import writable from 'svelte/store';

D import { store } from 'svelte/store';

Writable stores come from the 'svelte/store' module.

If you want to increase a count store by 1, which method is best?

A count.set(count + 1);

B count.update(n => n + 1);

C count.subscribe(n => n + 1);

D count.get() + 1;

update() safely changes the value based on current state.

Explain how writable stores help manage shared state in Svelte applications.

Think about how multiple parts of an app can see and change the same data.

Describe the difference between the set() and update() methods on writable stores.

One method needs the new value, the other uses a function to compute it.