flutter-navigation

Manage Flutter routing with go_router and auto_route strategies.

5|Updated Oct 14, 2025
One-click install
npx skills add https://github.com/reloveution/dart-flutter-rules --skill flutter-navigation-reloveution
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flutter-navigation
Source: https://github.com/reloveution/dart-flutter-rules/tree/main/skills/flutter-navigation
Command: npx skills add https://github.com/reloveution/dart-flutter-rules --skill flutter-navigation-reloveution

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the complex task of managing navigation and routing within Flutter applications, ensuring a smooth user experience across different platforms and scenarios.

Core Features & Use Cases

  • Routing Strategy: Implements declarative routing with go_router and code-generation with auto_route, offering robust solutions for deep linking, URL management, and browser history integration.
  • Data Passing: Facilitates secure and type-safe data transfer between screens using path parameters, query parameters, and route-specific extras.
  • Deep Linking & Web: Configures deep linking for iOS and Android, and manages web URL strategies for seamless browser integration.
  • Use Case: Implement a new feature that requires navigating to a product detail screen via a unique URL, passing the product ID, and ensuring the back button and browser history work as expected.

Quick Start

Use the flutter-navigation skill to implement deep linking for a '/products/:id' route using go_router.

Frequently Asked Questions about flutter-navigation

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

FAQPage Schema
How do I implement deep linking in Flutter with go_router?

To implement deep linking in Flutter, configure go_router with declarative routes that map URLs to specific screens. This ensures seamless navigation and browser history integration when handling incoming links across iOS and Android.

What is the best way to pass data between Flutter screens using routing?

The best way to pass data between Flutter screens is by using path parameters, query parameters, or route-specific extras. This approach ensures secure and type-safe data transfer during navigation.

Does this Flutter navigation approach support nested navigation with ShellRoute?

Yes, this Flutter navigation approach supports nested navigation using ShellRoute and AutoTabsRouter. This allows you to maintain persistent UI elements like bottom navigation bars across nested routes.

How do I configure route guards for authentication in Flutter?

To configure route guards for authentication in Flutter, implement redirection logic within your routing strategy. This protects restricted screens by validating user authorization before allowing navigation to those routes.

Can I use path-based routing for Flutter web applications?

Yes, you can use path-based routing for Flutter web applications. Configuring web URL strategies ensures seamless browser integration, allowing back buttons and browser history to function as expected.

What is the difference between declarative routing and code-generated routing in Flutter?

Declarative routing defines routes manually using go_router, while code-generated routing uses auto_route to generate boilerplate. Both handle deep linking and URL management but differ in implementation strategy and maintenance.