Subscribing with $ Auto-subscription
Use the $ prefix to auto-subscribe and auto-unsubscribe from stores in components.
Subscribing with $ Auto-subscription is a free Sveltejs Academy lesson on CoddyKit — lesson 2 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Sveltejs Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
The $ Prefix
Prefix a store with $ inside a component to auto-subscribe and read its value.
<script>
import { count } from "./stores";
</script>
<p>{$count}</p>Auto-Unsubscribe
Svelte unsubscribes automatically when the component is destroyed. No memory leaks.
Compile-Time Magic
The compiler rewrites $count into the proper subscribe/unsubscribe boilerplate at build time.
Assigning to $store
You can also assign: $count = 5 is shorthand for count.set(5).
Updating $store
Operators like $count++ work, calling set with the new value under the hood.
Component-Only
The $ shorthand is only valid inside .svelte files. In plain .js use get(store) or subscribe.
Inside Reactive Statements
$store values are reactive, so they trigger $: declarations.
$: doubled = $count * 2;Inside Markup
Use {$store} wherever you would interpolate a regular variable.
Multiple Stores
Auto-subscribe to as many stores as you need; each is tracked independently.
Avoid Side Effects in $
The $ shorthand is for reading and assigning. Do not put complex logic inline.
Performance
Auto-subscription costs almost nothing per component. Use freely for shared state.
Quick Check
What does $count do in a Svelte component?
Recap
The $store shorthand reads, writes, and auto-cleans subscriptions. Use it everywhere inside .svelte files.
Frequently asked questions
Is the “Subscribing with $ Auto-subscription” lesson free?
Yes — the full text of “Subscribing with $ Auto-subscription” is free to read here on the web, and the Sveltejs Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Sveltejs Academy course, upgrade to CoddyKit PRO.
What will I learn in “Subscribing with $ Auto-subscription”?
Use the $ prefix to auto-subscribe and auto-unsubscribe from stores in components. You practise Sveltejs Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Sveltejs Academy?
No prior experience is required. Sveltejs Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “Subscribing with $ Auto-subscription” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Sveltejs Academy lesson?
Yes. Every Sveltejs Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- Creating a writable Store
- Subscribing with $ Auto-subscription
- Updating Stores: set() and update()
- readable Stores and Custom Start Functions