react-native-apps

Build React Native and Expo mobile apps with routing, styling, and native modules.

2|1|Updated Jan 20, 2026

Search Tags:#performance #routing #styling #navigation #react-native #expo

Ready to run

npx skills add https://github.com/sraloff/gravityboots --skill react-native-apps

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: react-native-apps
Source: https://github.com/sraloff/gravityboots/tree/main/.agent/skills/react-native-apps
Command: npx skills add https://github.com/sraloff/gravityboots --skill react-native-apps

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps developers build mobile apps using React Native or Expo, simplifying navigation setup, styling decisions, and cross-platform considerations.

Core Features & Use Cases

Expo Router: File-based routing with expo-router for accessible screen organization.
Styling: NativeWind for rapid styling or StyleSheet for performance-critical views; ensure SafeArea handling across devices.
Performance: Use optimized lists like FlashList and ensure smooth 60fps interactions; minimize JS bridge overhead.
Navigation: Stack and Tabs patterns with support for deep links via app.json configuration to enable universal links.
Use Case: Build a two-screen mobile app with integrated navigation, responsive styling, and safe area compliance.

Quick Start

Create a new Expo React Native project and scaffold a two-screen app with stack navigation.

Frequently Asked Questions about react-native-apps

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

FAQPage Schema

How do I set up Expo Router for file-based routing in React Native?▼

Expo Router provides file-based routing for React Native apps, organizing screens by file structure. You scaffold a new Expo project and configure stack navigation to enable accessible screen organization and deep links.

What's the best way to handle SafeArea and styling in React Native?▼

Handle SafeArea across devices by choosing NativeWind for rapid styling or StyleSheet for performance-critical views. This ensures responsive UI compliance across iOS and Android platforms.

How do I optimize React Native list performance to maintain 60fps?▼

Optimize React Native list performance by using FlashList and Reanimated. These tools minimize JS bridge overhead and ensure smooth 60fps interactions during scrolling and animations.

How do I configure deep links and universal links in a React Native Expo app?▼

Configure deep links in your React Native app by modifying app.json to support universal links. This integrates with Expo Router navigation patterns like Stack and Tabs to enable seamless external routing.

Can I build a cross-platform React Native app that works on both iOS and Android?▼

Yes, React Native with Expo supports cross-platform mobile app development for iOS and Android. It handles native module integration and SafeArea considerations to ensure consistent behavior across both platforms.

When should I use NativeWind versus StyleSheet for React Native styling?▼

Use NativeWind for rapid styling during development, and switch to StyleSheet for performance-critical views. Both methods handle SafeArea compliance, but StyleSheet minimizes overhead for complex renders.