skills.rest
aberrantCode
aberrantCodeCOMMUNITY
Explore all skills by this author →
GitHub

react-native

Apply React Native patterns for modular architecture, navigation, and performance across iOS and Android.

1|Updated Feb 26, 2026
Search Tags:#architecture#navigation#react-native#state-management#expo#mobile-patterns
One-click install
npx skills add https://github.com/aberrantCode/llm_skills --skill react-native-aberrantcode
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-native
Source: https://github.com/aberrantCode/llm_skills/tree/main/claude/skills/react-native
Command: npx skills add https://github.com/aberrantCode/llm_skills --skill react-native-aberrantcode

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provide structured patterns, architecture guidance, and performance best practices for building scalable React Native apps that work on both iOS and Android.

Core Features & Use Cases

  • Functional Components Only: encourage modern React usage with clear props interfaces and typed components.
  • Hook-based logic and state management: promote separation of concerns with custom hooks and minimal UI logic in components.
  • Platform-specific patterns: guidance on using Platform.select and separate ios/android files for complex differences.
  • Navigation and performance: patterns for navigation setup, efficient list rendering, and animation considerations.
  • Use Case: build a two-platform app with shared business logic and platform-specific UI.

Quick Start

Load base.md and typescript.md to begin applying patterns for a robust React Native project.

Frequently Asked Questions about react-native

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

FAQPage Schema
What are the best practices for React Native architecture across iOS and Android?▼

React Native architecture best practices involve using functional components, hook-based state management, and platform-specific files to ensure modular design and shared logic across iOS and Android apps.

How do I manage state in React Native using custom hooks?▼

Manage state in React Native by separating concerns with custom hooks, keeping UI logic minimal in components, and enforcing functional components with clear props interfaces for robust hook-based state management.

Does this React Native pattern support Expo and platform-specific files?▼

Yes, these React Native patterns support Expo and guide the use of Platform.select alongside separate ios and android files to handle complex platform-specific differences effectively.

How do I optimize React Native navigation and list rendering performance?▼

Optimize React Native performance by applying specific navigation setup patterns, utilizing efficient list rendering techniques, and carefully managing animation considerations to maintain smooth cross-platform execution.

What is the best way to structure a React Native project for shared business logic?▼

The best way to structure a React Native project is enforcing modular architecture with functional components, allowing you to build a two-platform app with shared business logic and platform-specific UI.

Related Skills

Explore More Software Engineering Skills→
lava-chenlava-chen
1

react-component

Create typed, reusable React components with hooks and TypeScript patterns.

Community
Basic
JCE-Joshhh77JCE-Joshhh77
16

react-native

Plan and execute React Native tasks with Expo Router, Reanimated, and EAS workflows.

Community
Advanced
wanghaishengwanghaisheng

1k-cross-platform

Manage platform-specific code across web, mobile, desktop, and extension targets.

Community
Intermediate
thucpruthucpru

mobile-development

Guide mobile app architecture across React Native, Flutter, SwiftUI, and Kotlin.

Community
Basic