react-native-patterns

Standardize React Native and Expo apps with modular architecture and Zod validation.

3|Updated Jul 1, 2026
One-click install
npx skills add https://github.com/KeyValueSoftwareSystems/maestro --skill react-native-patterns-keyvaluesoftwaresystems
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-native-patterns
Source: https://github.com/KeyValueSoftwareSystems/maestro/tree/main/skills/stacks/react/react-native-patterns
Command: npx skills add https://github.com/KeyValueSoftwareSystems/maestro --skill react-native-patterns-keyvaluesoftwaresystems

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses the fragmentation and common pitfalls in React Native development by providing a standardized, deterministic approach to navigation, state management, and data fetching.

Core Features & Use Cases

  • Architectural Standards: Implements file-based routing with Expo Router and strict Zod-based parameter validation.
  • State & Data Management: Enforces a clear separation between server-side cache (TanStack Query) and client-side UI state (Zustand/Jotai).
  • Performance & Security: Provides optimized patterns for list virtualization and secure storage of sensitive tokens using Expo SecureStore.

Quick Start

Use the react-native-patterns skill to scaffold a new feature screen with integrated TanStack Query data fetching and Zod validation.

Frequently Asked Questions about react-native-patterns

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

FAQPage Schema
How do I structure React Native state management with TanStack Query and Zustand?

React Native state management should separate server-side cache using TanStack Query from client-side UI state using Zustand or Jotai. This pattern ensures deterministic data fetching and clear state boundaries within Expo projects.

How do I validate Expo Router parameters in a React Native application?

Expo Router parameters are validated using strict Zod schemas to enforce type-safe data handling. This approach standardizes navigation flows and prevents runtime errors from malformed route inputs in React Native.

What is the best way to store sensitive tokens securely in an Expo project?

Storing sensitive tokens securely in an Expo project requires Expo SecureStore. This pattern enforces encrypted local storage practices for authentication data and other sensitive user information in React Native applications.

How do I scaffold a React Native feature screen with Zod and data fetching?

Scaffolding a React Native feature screen involves integrating TanStack Query for server state and Zod for runtime validation. This enforces modular architecture and type-safe data handling within managed Expo projects.

Does this React Native development pattern work outside of managed Expo projects?

These React Native patterns are specifically designed for managed Expo projects. They enforce standardized file-based routing with Expo Router and secure storage practices that depend on the Expo ecosystem.

Why use Zod validation for React Native navigation flows?

Zod validation for React Native navigation flows enforces strict parameter typing and prevents runtime crashes from invalid data. It standardizes route handling and ensures type-safe data passing between screens.