home / skills / sickn33 / antigravity-awesome-skills / react-native-architecture

react-native-architecture skill

This skill helps you architect production-ready React Native apps with Expo, navigation, native modules, and offline-first patterns.

This is most likely a fork of the react-native-architecture skill from xfstudio

npx playbooks add skill sickn33/antigravity-awesome-skills --skill react-native-architecture

Review the files below or copy the command above to add this skill to your agents.

Files (2)

SKILL.md

1.2 KB

---
name: react-native-architecture
description: Build production React Native apps with Expo, navigation, native modules, offline sync, and cross-platform patterns. Use when developing mobile apps, implementing native integrations, or architecting React Native projects.
---

# 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.

Overview

This skill provides production-ready architecture patterns for building React Native apps with Expo. It covers navigation strategies, state management, native module integration, offline-first sync, and cross-platform conventions to ship maintainable mobile apps. Use it to design app structure, enforce patterns, and produce actionable implementation steps.

How this skill works

The skill inspects project goals, platform targets, and constraints, then recommends architecture components—navigation routing, global state, data sync layers, native bridges, and performance optimizations. It returns step-by-step setup guidance, code patterns, CI/CD checkpoints, and verification steps tailored to Expo or bare React Native workflows. When requested, it expands to concrete examples and migration plans from existing projects.

When to use it

Starting a new React Native or Expo application
Designing or standardizing navigation and routing patterns
Integrating native modules or platform APIs
Implementing offline-first data synchronization and caching
Optimizing performance and memory usage for mobile
Setting up CI/CD and release pipelines for mobile apps

Best practices

Define a clear directory layout separating features, screens, and native bindings
Use declarative navigation (React Navigation) with typed route params and modular stacks
Centralize side effects in a sync layer (background sync, queueing, conflict resolution)
Prefer lightweight state stores per feature; use Redux/Context/Query where they fit
Wrap native modules with small, well-tested adapters and fallbacks for web/Expo Go
Automate builds, linting, and tests in CI; run end-to-end tests on device farms

Example use cases

Blueprint for a new Expo app with authentication, deep links, and offline sync
Migration plan to add a native barcode scanner with graceful fallback
Implementing conflict-free background sync for intermittent connectivity
Performance audit and fixes for list rendering, JS thread contention, and memory leaks
CI pipeline that builds, signs, and publishes Android and iOS releases

FAQ

Can this architecture work with both Expo Managed and Bare workflows?

Yes. Patterns include variants for Expo Managed (with config plugins) and Bare workflows. Recommendations specify when to eject or add native modules.

Does it include offline conflict resolution strategies?

Yes. The skill outlines queueing, CRDTs or last-writer-wins strategies, reconciliation steps, and verification flows to validate sync correctness.