skills.rest
sraloff
sraloffCOMMUNITY
Explore all skills by this author →
Website𝕏@sraloffGitHub

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
One-click install
npx skills add https://github.com/sraloff/gravityboots --skill react-native-apps
Or copy as Structured Prompt for Agent▼
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.

Related Skills

Explore More Software Engineering Skills→
aidenreed937aidenreed937

comet-scaffold

Create standardized React Native project scaffolds via CLI and comet.yaml configuration.

Community
Advanced
nghiahsgsnghiahsgs
32

expo-deployment

Deploy Expo React Native apps to app stores and web via EAS Build and Submit.

Community
Advanced
jakubciszakjakubciszak
1

react-native-expo

Implement React Native mobile app screens with Expo and TypeScript.

Community
Intermediate
Gentleman-ProgrammingGentleman-Programming
618

react-native

Implement React Native patterns with Expo Router, NativeWind, and TypeScript.

Official
Advanced