playbooks

home / skills / partme-ai / full-stack-skills / react-native

react-native skill

/skills/react-native

This skill provides guidance for React Native development across components, navigation, native modules, and platform-specific code to build mobile apps.

npx playbooks add skill partme-ai/full-stack-skills --skill react-native

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

Files (2)
SKILL.md
728 B
---
name: react-native
description: Provides comprehensive guidance for React Native development including components, navigation, native modules, platform-specific code, and mobile app development. Use when the user asks about React Native, needs to create mobile applications, implement React Native components, or work with React Native features.
license: Complete terms in LICENSE.txt
---

## When to use this skill

Use this skill whenever the user wants to:
- [待完善：根据具体工具添加使用场景]

## How to use this skill

[待完善：根据具体工具添加使用指南]

## Best Practices

[待完善：根据具体工具添加最佳实践]

## Keywords

[待完善：根据具体工具添加关键词]

Overview

This skill provides comprehensive, practical guidance for building mobile apps with React Native. It covers components, navigation, native modules, platform-specific code, performance, and testing. Use it to design, implement, and troubleshoot cross-platform React Native projects with clear, actionable advice.

How this skill works

The skill inspects app architecture, suggests component patterns, and recommends navigation and state-management strategies tailored to your use case. It explains how to integrate native modules, implement platform-specific APIs, and optimize performance for iOS and Android. It also provides code examples, debugging tips, and testing strategies to validate changes before release.

When to use it

  • Starting a new cross-platform mobile app with JavaScript/TypeScript
  • Implementing or refactoring UI components and navigation flows
  • Integrating native features (camera, Bluetooth, sensors) via native modules
  • Optimizing performance and reducing bundle size for production builds
  • Setting up testing, CI, or release pipelines for mobile apps

Best practices

  • Prefer functional components with hooks and TypeScript for maintainability
  • Use community-backed libraries for navigation (React Navigation) and common native features
  • Keep platform-specific code isolated behind well-defined modules or abstractions
  • Profile and measure performance with Flipper and Hermes before optimizing
  • Write unit and integration tests for critical logic and e2e tests for flows

Example use cases

  • Create a tabbed app with stack navigation, deep linking, and state persistence
  • Implement a native module to access a custom Bluetooth API on Android/iOS
  • Refactor a large UI into smaller reusable components with consistent styling
  • Resolve layout and touch handling differences between iOS and Android
  • Configure Hermes, Proguard, and image optimization to reduce app size

FAQ

Should I use Expo or plain React Native?

Use Expo for faster prototyping and simpler native APIs; eject to bare React Native when you need custom native modules or advanced native configuration.

How do I debug platform-specific bugs?

Reproduce the issue on the target device, use platform logs (adb logcat, Xcode console), run Flipper, and isolate code behind platform checks to narrow scope.