LibraryActive

TanStack Store

Framework-agnostic reactive store library providing BaseAtom and related primitives.

Open source page ↗

Product features

Product features

actionsFactory

Constructor option to create store actions.

Atom

Typed interface extending BaseAtom<T> with get, set, and subscribe.

Atom.get()

Returns the current value of type T.

AtomOptions

Interface defining configuration options for atoms, including a compare function.

Atom.set

Sets the value of the atom using a function.

Atom.subscribe

Subscribe to atom value changes.

BaseAtom

Subscribable and Readable interface extended by Atom and ReadonlyAtom.

batch

Batches store updates.

Building a Full Stack DevJokes App with TanStack Start

createAsyncAtom

Creates an atom backed by async logic.

createAtom

Factory function to create an atom.

createStore

Create a store with an explicit update path via setState.

flush

Flushes pending updates.

Framework adapters

Thin adapters for React, Preact, Solid, Vue, Angular, Svelte, and Lit.

Framework Agnostic

Can be used as a standalone library for any framework or application.

Framework-agnostic core

Use the same core from vanilla TypeScript.

get()

Returns T; inherited from Readable.get.

get()

Method returning T, defined in store.ts:76.

getValue

Constructor parameter accepting previous value (prev?) returning T.

Immutable updates

Update store values through an explicit setState path.

initialValue

Constructor parameter taking the initial value of type T.

Install uuid for generating unique IDs

InternalReadonlyAtom

Internal read-only atom interface extending InternalBaseAtom and ReactiveNode.

InteropSubscribable interface

Interface with a subscribe method accepting an observer and returning a Subscription.

Nice to know

Prerequisites

ReadonlyStore

Read-only store class.

ReadonlyStore

Readonly store class implementing Omit<Store<T>, "setState" | "actions">.

setState()

Updates state with an updater function or value.

Setting up a TanStack Start Project

snapshot

Internal snapshot property defined in types.ts:37.

snapshot property

Internal snapshot property inherited from InternalBaseAtom.

state accessor

Accessor returning T, defined in store.ts:73.

Step 1.1: Create a JSON File with Jokes

Step 1.2: Create Types for Our Data

Step 1.3: Create Server Functions to Read the File

Step 1.4: Consume Server Function on the Client Side

Step 1: Reading Data From a File

Store

Mutable store class exported by @tanstack/store.

subscribe

Inherited from Subscribable.subscribe.

subscribe()

Method taking Observer<T> | (value) => void and returning Subscription.

Subscribers

Subscribe at the granularity the renderer needs.

Understanding the project structure

update()

Internal update method accepting an optional getValue function returning boolean.

update() method

Internal update method accepting an optional getValue callback and returning boolean.

What You'll Learn