Agent Skills: React Native Navigation

Set up navigation stacks and deep linking with React Navigation in React Native. Use when setting up navigation stacks or deep linking in React Native with React Navigation. (triggers: **/App.tsx, **/*Navigator.tsx, **/*Screen.tsx, NavigationContainer, createStackNavigator, createBottomTabNavigator, linking, deep link)

UncategorizedID: hoangnguyen0403/agent-skills-standard/react-native-navigation

Install this agent skill to your local

pnpm dlx add-skill https://github.com/HoangNguyen0403/agent-skills-standard/tree/HEAD/skills/react-native/react-native-navigation

Skill Files

Browse the full folder contents for react-native-navigation.

Download Skill

Loading file tree…

skills/react-native/react-native-navigation/SKILL.md

Skill Metadata

Name
react-native-navigation
Description
"Set up navigation stacks and deep linking with React Navigation in React Native. Use when setting up navigation stacks or deep linking in React Native with React Navigation. (triggers: **/App.tsx, **/*Navigator.tsx, **/*Screen.tsx, NavigationContainer, createStackNavigator, createBottomTabNavigator, linking, deep link)"

React Native Navigation

Priority: P1 (OPERATIONAL)

Navigation and deep linking using React Navigation.

Configure Type-Safe Navigation

  • Library: Use @react-navigation/native-stack for native performance.
  • Type Safety: Define RootStackParamList for all navigators.
  • Deep Links: Configure linking prop in NavigationContainer.
  • Validation: Validate route parameters (route.params) before fetching data.

See routing patterns for type-safe stack setup and deep linking configuration.

Anti-Patterns

  • No Untyped Navigation: navigation.navigate('Unknown') leads to errors. Use typed params.
  • No Manual URL Parsing: Use linking.config, not manual string parsing.
  • No Unvalidated Deep Links: Handle invalid IDs gracefully (e.g., redirect to Home/404).

References

See references/routing-patterns.md for typed param lists and deep linking config.