expo-router-patterns

Implements Expo Router navigation patterns in React Native apps.

2|1|Updated Nov 13, 2025
One-click install
npx skills add https://github.com/MolcajeteAI/plugin --skill expo-router-patterns-molcajeteai
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: expo-router-patterns
Source: https://github.com/MolcajeteAI/plugin/tree/main/deprecated/tech-stacks/js/react-native/skills/expo-router-patterns
Command: npx skills add https://github.com/MolcajeteAI/plugin --skill expo-router-patterns-molcajeteai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the implementation of navigation within React Native applications using Expo Router by providing clear examples and best practices for file-based routing, dynamic routes, and protected screens.

Core Features & Use Cases

  • File-Based Routing: Understand how directory structure maps to URL routes.
  • Dynamic Routes: Implement routes with variable parameters (e.g., /user/[id]).
  • Navigation Components: Utilize Link and useRouter for programmatic navigation.
  • Layouts: Configure root, tab, and modal layouts.
  • Protected Routes: Secure routes based on authentication status.
  • Deep Linking: Set up and handle external links to specific app routes.

Quick Start

Use the expo-router-patterns skill to generate a basic tab navigation structure for a React Native app.

Frequently Asked Questions about expo-router-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up file-based routing in React Native with Expo Router?

File-based routing in Expo Router maps your directory structure directly to URL routes. You create files and folders in your project to define the navigation hierarchy, simplifying app structure without manual route configuration.

How do I handle dynamic routes and variable parameters in Expo Router?

Dynamic routes in Expo Router handle variable parameters using bracket syntax like `/user/[id]`. This pattern captures URL segments as parameters, allowing you to pass data programmatically to specific screens.

What's the best way to configure layouts for tabs and modals in Expo Router?

Configuring layouts in Expo Router involves defining root, tab, and modal configurations within your directory structure. This wraps nested screens in shared UI components, creating consistent navigation flows across your app.

Can I secure screens with protected routes based on authentication status?

You can secure screens with protected routes based on authentication status in Expo Router. This restricts unauthorized access and redirects unauthenticated users away from sensitive screens.

How do I set up deep linking to specific app routes in Expo Router?

Setting up deep linking in Expo Router configures your app to handle external links pointing to specific app routes. This allows incoming URLs to navigate users directly to the correct screen within your React Native application.