Expo Mobile App Rule

What it does

This skill assists with building mobile applications using Expo and Expo Router, a framework that simplifies navigation in React Native projects. It provides guidance on structuring your project files for routing and demonstrates how to define layouts and tabs within your application. The skill focuses specifically on understanding the file-based routing system employed by Expo Router.

When to use it

• When setting up the initial structure of an Expo mobile app project.
• To understand how file names dictate routes in Expo Router.
• For guidance on creating tab navigations and root layouts within your application.
• When implementing dynamic routes using parameters (e.g., /user/:id).

Key capabilities

• File-Based Routing: Explains how the file system determines navigation paths.
• Root Layout Definition: Demonstrates how to define a root layout for your app.
• Tab Navigation Implementation: Provides examples of creating and configuring tab navigations.
• Dynamic Route Handling: Shows how to create routes with parameters.
• Navigation Methods: Introduces the use of useRouter, useLocalSearchParams, and <Link> components from Expo Router.

Example prompts

• "Show me an example of a root layout in Expo Router."
• "How do I create a tab navigation in my Expo app?"
• "Explain how file-based routing works with Expo Router."
• "Can you give me an example of creating a dynamic route like /user/:id?"

Tips & gotchas

• This skill focuses on the structure and principles of Expo Router, not general React Native development.
• Understanding the file system's role in routing is crucial for effectively using this skill.
• The provided code snippets are examples; adapt them to your specific project needs.