# Build React Native Apps with Expo

Mobile projects need clear guidance for setup, platform differences, and common interface patterns. This skill provides focused React Native and Expo workflows for building and troubleshooting mobile apps.

## Install

```bash
npx skillstore add babakbar/react-native-mobile-development
```

## Metadata

- Status: approved
- Slug: babakbar-react-native-mobile-development
- Skillstore revision: r3
- Version status: missing
- Tree hash: a280c62646df61d7e73caa834bada9ed32d2300903e34bafbe91f30989365aee
- Author: BabakBar
- GitHub username: BabakBar
- License: MIT
- Repository: https://github.com/BabakBar/VibeKeeper/tree/main/.claude/skills/react-native-mobile
- Ref: 80999bf530a7874d7bedf8ce202001ecb4c4f5e0
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: allowed
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: external\_commands, network
- Quality score: 76
- Public page: https://skillstore.pages.dev/skills/babakbar-react-native-mobile-development
- Manifest: https://skillstore.pages.dev/api/skills/babakbar-react-native-mobile-development/manifest

## Capabilities

- Explains npm and Expo commands for starting, building, and prebuilding a mobile project.
- Provides a reusable React Native component structure with styles and press handling.
- Shows platform-specific rendering, values, and styles for iOS and Android.
- Demonstrates list, form, and loading-state patterns using React Native components.
- Lists practical checks for Metro, native module, build, and simulator problems.

## Use Cases

- Start an Expo project: Set up a development workflow and choose the appropriate Expo commands for a new mobile application.
- Build cross-platform components: Create accessible React Native components that adapt layout and behavior for iOS and Android.
- Resolve local development issues: Work through common Metro, prebuild, configuration, and simulator issues with targeted checks.

## Prompt Templates

### Create a starter component

```
Create a React Native button component with a title, press handler, accessible label, and StyleSheet styles.
```

### Add platform-specific styling

```
Show how to apply iOS shadow styles and Android elevation to this React Native card component.
```

### Improve a long list

```
Review this screen design and propose a FlatList structure with stable keys, empty state, and loading state.
```

### Plan Expo troubleshooting

```
My Expo build fails after adding a native module. Create a step-by-step diagnostic plan using my app configuration and build logs.
```

## Limitations

- It does not create, run, or test a project without user approval and a configured environment.
- It does not replace platform documentation for native build signing or store submission.
- Examples are general patterns and require adaptation to the project architecture.
- It does not diagnose device-specific issues without logs and project context.

## Best Practices

- Use StyleSheet.create and test layouts on both iOS and Android.
- Add accessibility labels and roles to interactive controls.
- Review package compatibility before installing dependencies or regenerating native projects.

## Anti Patterns

- Do not assume iOS and Android use identical layout or native behavior.
- Do not use array indexes as list keys when stable item identifiers exist.
- Do not run clean or prebuild commands before checking uncommitted project changes.

## Security Audit

- Audited at: 2026-07-18T10:18:50.516\+00:00
- Summary: All 20 static detections are false positives caused by Markdown fences, inline code, documentation links, and ordinary mobile development instructions. The skill contains no prompt-injection language, data-exfiltration intent, hidden commands, or system reconnaissance.

## Stats

- Views: 238
- Downloads: 13
- Favorites: 0
- Popularity score: 0