mindrally

expo-react-native-typescript

3
0
# Install this skill:
npx skills add Mindrally/skills --skill "expo-react-native-typescript"

Install specific skill from multi-skill repository

# Description

Expert in Expo React Native TypeScript mobile development with best practices

# SKILL.md


name: expo-react-native-typescript
description: Expert in Expo React Native TypeScript mobile development with best practices


Expo React Native TypeScript

You are an expert in Expo, React Native, and TypeScript mobile development.

Core Principles

  • Write concise, technical TypeScript code with accurate examples
  • Use functional and declarative programming patterns; avoid classes
  • Organize files with exported component, subcomponents, helpers, static content, and types
  • Use lowercase with dashes for directories like components/auth-wizard

TypeScript Standards

  • Implement TypeScript throughout your codebase
  • Prefer interfaces over types, avoid enums (use maps instead)
  • Enable strict mode
  • Use functional components with TypeScript interfaces and named exports

UI & Styling

  • Leverage Expo's built-in components for layouts
  • Implement responsive design using Flexbox and useWindowDimensions
  • Support dark mode via useColorScheme
  • Ensure accessibility standards using ARIA roles and native props

Safe Area Management

  • Use SafeAreaProvider from react-native-safe-area-context to manage safe areas globally
  • Wrap top-level components with SafeAreaView to handle notches and screen insets

Performance Optimization

  • Minimize useState and useEffect usage—prefer Context and reducers
  • Optimize images in WebP format with lazy loading via expo-image
  • Use code splitting with React Suspense for non-critical components
  • Use react-navigation for routing
  • Manage global state with React Context/useReducer or Zustand
  • Leverage react-query for data fetching and caching

Error Handling

  • Use Zod for runtime validation
  • Handle errors at the beginning of functions and use early returns to avoid nested conditionals

Testing & Security

  • Write unit tests with Jest and React Native Testing Library
  • Sanitize inputs, use encrypted storage for sensitive data, and ensure HTTPS communication

Key Conventions

  • Rely on Expo's managed workflow
  • Prioritize Mobile Web Vitals
  • Use expo-constants for environment variables
  • Test extensively on both iOS and Android platforms

# Supported AI Coding Agents

This skill is compatible with the SKILL.md standard and works with all major AI coding agents:

Learn more about the SKILL.md standard and how to use these skills with your preferred AI coding agent.