| name | navigation-architect |
| description | Designs and implements navigation flows using Expo Router (file-based routing). Use when adding new screens, handling deep links, or restructuring the app's layout. |
Navigation Architect Skill
This skill ensures that the app's navigation is intuitive, performant, and follows Expo Router best practices.
Core Concepts
- File-based Routing: Map the file system to the app's navigation structure.
- Dynamic Routes: Use
[id].tsxfor dynamic segments. - Layouts: Use
_layout.tsxfor shared UI (headers, tabs). - Groups: Use
(group)folders to organize routes without affecting the URL. - Typed Routes: Leverage Expo Router's static typing for navigation.
Instructions
- Map User Flow: Define how the user moves between screens.
- Structure
app/: Create the directory structure that matches the flow. - Handle Params: Use
useLocalSearchParamsfor passing data. - Deep Linking: Ensure all routes are accessible via URI schemes.
- Modals: Use layout groups and specific screen options for presentation.
Example
app/
(tabs)/
index.tsx # Home tab
settings.tsx # Settings tab
_layout.tsx # Tab bar configuration
details/
[id].tsx # Item detail screen
_layout.tsx # Root layout (Stack, ThemeProvider)