offline-first

Persist React Native data offline with Zustand, MMKV, and React Query.

Updated Feb 27, 2026
One-click install
npx skills add https://github.com/alejandro-technology/react-native-template --skill offline-first-alejandro-technology
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: offline-first
Source: https://github.com/alejandro-technology/react-native-template/tree/main/.claude/skills/enforcement/offline-first
Command: npx skills add https://github.com/alejandro-technology/react-native-template --skill offline-first-alejandro-technology

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Enforce offline-first patterns using Zustand + MMKV for persistence, and React Query for server state synchronization, with simple connectivity-aware strategies to keep the UI responsive when offline.

Core Features & Use Cases

  • Offline cache with MMKV persistence via Zustand to store module data.
  • Sync React Query results to the offline store on success.
  • Queue mutations when offline and replay them automatically when connectivity is restored.

Quick Start

Integrate the offline-first pattern by scaffolding a Zustand MMKV store, wiring React Query to update the store on success, and adding a simple connectivity check to toggle the offline queue.

Frequently Asked Questions about offline-first

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

FAQPage Schema
How do I queue and replay mutations in React Native when the network is offline?

To queue and replay mutations offline, you intercept mutation calls, store them in a local queue, and replay them automatically when connectivity is restored using a connectivity detection listener.

How do I persist React Query cache offline using MMKV and Zustand?

You can persist React Query cache offline by syncing query results to a Zustand store on success, then writing that state to MMKV for lightweight local persistence across app restarts.

What is the best way to handle optimistic updates with rollback for offline mutations?

The best way to handle optimistic updates with rollback is to apply the change to the local store immediately, and revert the state if the queued mutation fails during replay when online.

Can I use an offline-first architecture with React Query and Zustand for server state synchronization?

Yes, you can use an offline-first architecture with React Query and Zustand by syncing server data to a local store and toggling mutation queues based on network connectivity.

How do I detect network connectivity to toggle an offline mutation queue in React Native?

You detect network connectivity using native APIs or event listeners, and use the resulting online or offline status to toggle your mutation queue and trigger automatic replay.

Why do my offline mutations fail to sync when the app reconnects to the network?

Offline mutations fail to sync if the mutation queue lacks a connectivity listener to trigger replay, or if optimistic updates lack rollback logic to restore local state on replay errors.