expo-router

What it does

Expo Router enables declarative navigation and file-based routing within Expo applications, replacing complex manual navigation logic with a filesystem-driven structure. It allows developers to define app routes directly in code files, streamlining the development of mobile interfaces.

When to use it

• Building new Expo projects that require a scalable, maintainable navigation architecture from the start.
• Replacing legacy react-navigation setups where file-based organization is preferred over complex configuration objects.
• Developing apps that need seamless integration between static routes and dynamic parameters without boilerplate code.

Key capabilities

• File-based routing: Routes are defined by creating files in the project directory structure.
• Declarative navigation: Navigation logic is inferred from the file system rather than imperative commands.
• Type safety: Provides built-in type checking for route parameters and query strings.
• Nested layouts: Supports complex UI structures with nested layout definitions for consistent headers or footers.

Example prompts

• "Create a new page component at /settings/profile that displays user details."
• "Set up a dynamic route pattern to handle multiple product pages based on an ID parameter."
• "Configure a root layout that wraps all child screens with a consistent navigation bar."

Tips & gotchas

Ensure your project is initialized with the expo-router package and configured correctly in app.json before attempting to use file-based routes. Avoid mixing imperative navigation calls with declarative routing patterns, as this can lead to inconsistent state management.