react-native

Provide React Native development patterns covering structure, state, and testing.

1|Updated Jan 26, 2026
One-click install
npx skills add https://github.com/simoabid/ABID.Dev-Portfolio --skill react-native-simoabid
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-native
Source: https://github.com/simoabid/ABID.Dev-Portfolio/tree/main/.agent/skills/react-native
Command: npx skills add https://github.com/simoabid/ABID.Dev-Portfolio --skill react-native-simoabid

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a structured approach and best practices for developing React Native mobile applications, ensuring maintainability and scalability.

Core Features & Use Cases

  • Project Structure: Opinionated directory layout for organizing code.
  • Component Patterns: Guidelines for creating reusable and testable UI components.
  • State Management: Strategies for managing local, global, and server state.
  • Testing: Recommendations for unit and integration testing.
  • Platform-Specific Code: Handling differences between iOS and Android.
  • Use Case: Develop a new feature for a React Native app, ensuring it follows established patterns for components, state, and testing.

Quick Start

Use the react-native skill to generate a new screen component named 'UserProfile'.

Frequently Asked Questions about react-native

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

FAQPage Schema
What's the best way to structure a React Native project for scalability?

A structured approach to React Native development uses an opinionated directory layout to organize code logically. This ensures maintainability and scalability when building cross-platform mobile applications.

How do I manage state in a React Native app using Zustand and React Query?

State management in React Native is handled by using Zustand for local and global state, and React Query for server state. This separation ensures predictable data flow and easier testing of UI components.

How do I handle platform-specific code for iOS and Android in React Native?

Handle platform-specific code in React Native by following established patterns for detecting and managing differences between iOS and Android. This ensures your cross-platform mobile app remains maintainable.

Can I use React Native Testing Library for unit and integration tests?

Yes, you can use React Native Testing Library for unit and integration testing. It provides recommendations and patterns to ensure your UI components are thoroughly tested and avoid common anti-patterns.

What are common anti-patterns to avoid when building cross-platform mobile apps?

Common anti-patterns to avoid in cross-platform mobile apps include poor component design and tangled state management. Following established React Native patterns for testable components and structured state prevents these issues.