# React Native Navigation

> React Navigation 6+ standards for stack, tab, and deep linking.

- Skill: `fierzone/react-native-navigation` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add fierzone/react-native-navigation`
- Raw SKILL.md: https://api.skillmd.com/api/skills/fierzone/react-native-navigation/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: fierzone (https://skillmd.com/u/fierzone)
- Updated: 2026-09-10
- Page: https://skillmd.com/skills/fierzone/react-native-navigation

---


# React Native Navigation

## **Priority: P0 (CRITICAL)**

Use **React Navigation** (official solution).

## Implementation Guidelines

- **Typed Navigation**: Use TypeScript to define param lists.
- **Centralized**: Define all navigators in `src/navigation/`.
- **Nesting**: Nest navigators (e.g., Tab inside Stack).
- **Options**: Set `screenOptions` at navigator level, override per screen.
- **Header**: Customize with `headerTitle`, `headerRight`, `headerLeft`.
- **Deep Linking**: Configure `linking` config for universal links.

## Code

```tsx
type RootStackParamList = {
  Home: undefined;
  Profile: { userId: string };
};

// Typed Navigation
const Stack = createNativeStackNavigator<RootStackParamList>();

function RootNavigator() {
  return (
    <Stack.Navigator>
      <Stack.Screen name='Home' component={HomeScreen} />
      <Stack.Screen name='Profile' component={ProfileScreen} />
    </Stack.Navigator>
  );
}

// Usage in Screen
function HomeScreen({
  navigation,
}: NativeStackScreenProps<RootStackParamList, 'Home'>) {
  navigation.navigate('Profile', { userId: '123' });
}
```

## Anti-Patterns

- **No String Literals**: Use typed params.
- **No Navigation in Business Logic**: Pass callbacks from screens.
- **No Deep Nesting**: Max 2-3 levels of navigators.

## Reference & Examples

See [references/deep-linking.md](references/deep-linking.md) for Universal Links, Nested Navigators, and State Persistence.

## Related Topics

architecture | typescript/language