AI Agent Skill HUB

react-native-architecture

Production-ready patterns for React Native development with Expo, including navigation, state management, native modules, and offline-first architecture.

5 stars
byFrancoStino
View on GitHubInstallation ↓

Best use case

react-native-architecture is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Production-ready patterns for React Native development with Expo, including navigation, state management, native modules, and offline-first architecture.

Teams using react-native-architecture should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/react-native-architecture/SKILL.md --create-dirs "https://raw.githubusercontent.com/FrancoStino/opencode-skills-collection/main/bundled-skills/react-native-architecture/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/react-native-architecture/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How react-native-architecture Compares

Feature / Agentreact-native-architectureStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Production-ready patterns for React Native development with Expo, including navigation, state management, native modules, and offline-first architecture.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

Related Guides

AI Agents for Coding

Browse AI agent skills for coding, debugging, testing, refactoring, code review, and developer workflows across Claude, Cursor, and Codex.

SKILL.md Source

# React Native Architecture

Production-ready patterns for React Native development with Expo, including navigation, state management, native modules, and offline-first architecture.

## Use this skill when

- Starting a new React Native or Expo project
- Implementing complex navigation patterns
- Integrating native modules and platform APIs
- Building offline-first mobile applications
- Optimizing React Native performance
- Setting up CI/CD for mobile releases

## Do not use this skill when

- The task is unrelated to react native architecture
- You need a different domain or tool outside this scope

## Instructions

- Clarify goals, constraints, and required inputs.
- Apply relevant best practices and validate outcomes.
- Provide actionable steps and verification.
- If detailed examples are required, open `resources/implementation-playbook.md`.

## Resources

- `resources/implementation-playbook.md` for detailed patterns and examples.

## Limitations
- Use this skill only when the task clearly matches the scope described above.
- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.

Related Skills

vercel-react-view-transitions

5
from FrancoStino/opencode-skills-collection

Guide React and Next.js view transitions, shared element animations, route transitions, transition types, and reduced-motion-safe UI state animation.

software-architecture

5
from FrancoStino/opencode-skills-collection

Guide for quality focused software architecture. This skill should be used when users want to write code, design architecture, analyze code, in any case that relates to software development.

site-architecture

5
from FrancoStino/opencode-skills-collection

Plan or restructure website hierarchy, navigation, URL patterns, breadcrumbs, and internal linking. Use when mapping pages, sections, and site structure, but not for XML sitemap auditing or schema markup.

robius-app-architecture

5
from FrancoStino/opencode-skills-collection

CRITICAL: Use for Robius app architecture patterns. Triggers on: Tokio, async, submit_async_request, 异步, 架构, SignalToUI, Cx::post_action, worker task, app structure, MatchEvent, handle_startup

react-ui-patterns

5
from FrancoStino/opencode-skills-collection

Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states.

react-state-management

5
from FrancoStino/opencode-skills-collection

Master modern React state management with Redux Toolkit, Zustand, Jotai, and React Query. Use when setting up global state, managing server state, or choosing between state management solutions.

react-patterns

5
from FrancoStino/opencode-skills-collection

Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.

react-nextjs-development

5
from FrancoStino/opencode-skills-collection

React and Next.js 14+ application development with App Router, Server Components, TypeScript, Tailwind CSS, and modern frontend patterns.

react-native-skills

5
from FrancoStino/opencode-skills-collection

Use when working with react-native-skills tasks or workflows

react-modernization

5
from FrancoStino/opencode-skills-collection

Master React version upgrades, class to hooks migration, concurrent features adoption, and codemods for automated transformation.

react-flow-node-ts

5
from FrancoStino/opencode-skills-collection

Create React Flow node components following established patterns with proper TypeScript types and store integration.

react-flow-architect

5
from FrancoStino/opencode-skills-collection

Build production-ready ReactFlow applications with hierarchical navigation, performance optimization, and advanced state management.