tanstack-store

Manage application state with a framework-agnostic reactive store.

Updated Apr 14, 2026
One-click install
npx skills add https://github.com/iEnergyy/opsflow --skill tanstack-store-ienergyy
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tanstack-store
Source: https://github.com/iEnergyy/opsflow/tree/main/.agents/skills/tanstack-store
Command: npx skills add https://github.com/iEnergyy/opsflow --skill tanstack-store-ienergyy

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Store provides a lightweight, framework-agnostic reactive store that powers state management with Store for state, Derived for computed values, and Effect for side effects. It enables atomic updates via batch and offers framework adapters to expose reactive hooks in React, Vue, Solid, Angular, and Svelte.

Core Features & Use Cases

  • Core: Store (state), Derived (computed), Effect (side effects), batch (atomic updates)
  • Framework adapters across React, Vue, Solid, Angular, and Svelte to expose hooks and composables
  • Real-world usage: Build modular UIs where store state drives derived values and triggers side effects, with framework-agnostic simplicity.

Quick Start

Install @tanstack/store and start creating a Store with an initial state in your application.

Frequently Asked Questions about tanstack-store

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I manage reactive state across multiple frameworks without rewriting logic?

A framework-agnostic reactive store manages application state by exposing Store, Derived, and Effect through specific adapters for React, Vue, Solid, Angular, and Svelte. This enables you to share state logic across frameworks without rewriting it.

What is the best way to handle computed values and side effects in a reactive store?

Using Derived for computed values and Effect for side effects is the best way to handle these in a reactive store. This pattern ensures computed values update automatically and side effects trigger reliably based on state changes.

Does TanStack Store work with React, Vue, Solid, Angular, and Svelte?

Yes, TanStack Store works with React, Vue, Solid, Angular, and Svelte by providing framework adapters. These adapters expose reactive hooks and composables to integrate the framework-agnostic store seamlessly into your application.

How do I batch atomic state updates in a reactive store?

You can batch atomic state updates in a reactive store by using the built-in batch functionality. Batch groups multiple state mutations together, ensuring derived values and effects only re-evaluate once after the batch completes.

When do I need a framework-agnostic state management solution?

You need a framework-agnostic state management solution when building modular UIs across different frameworks or migrating between them. It allows store state to drive derived values and trigger side effects independently of the rendering layer.

How does lifecycle management work for effects in a reactive store?

Lifecycle management for effects in a reactive store works through mount and unmount semantics provided by framework adapters. This ensures side effects are properly initialized when a component mounts and safely cleaned up when it unmounts.