flutter-routing-and-navigation

Implement Flutter navigation with Navigator, nested stacks, and go_router deep links.

1|Updated Mar 6, 2026
One-click install
npx skills add https://github.com/takzobye/flutter_social_share_plus --skill flutter-routing-and-navigation
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flutter-routing-and-navigation
Source: https://github.com/takzobye/flutter_social_share_plus/tree/main/.agents/skills/flutter-routing-and-navigation
Command: npx skills add https://github.com/takzobye/flutter_social_share_plus --skill flutter-routing-and-navigation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps Flutter developers select and implement the appropriate navigation and routing strategy, manage deep links, and reliably pass data between screens while avoiding common pitfalls like improper stack handling or broken web URL synchronization.

Core Features & Use Cases

  • Routing decision logic to choose between imperative Navigator, declarative Router (e.g., go_router), or nested Navigator flows based on app complexity.
  • Imperative navigation patterns with push/pop and data passing via constructors or RouteSettings for simple apps.
  • Named route and onGenerateRoute guidance with caveats for deep linking and web forward-button behavior.
  • Nested Navigator implementation using GlobalKey<NavigatorState> to isolate sub-flows such as multi-step wizards or persistent bottom navigation.
  • Deep linking and web synchronization recommendations, favoring Router/go_router for advanced URL handling and cross-platform consistency.
  • Validation and safety checks to avoid closing the app unintentionally, handle null/typed route arguments, and ensure MaterialApp initialRoute/home consistency.

Quick Start

Use the flutter-routing-and-navigation skill to design and implement the navigation approach for your app by specifying whether you need simple Navigator.push-based flows, Router/go_router for deep links and web URL sync, or nested navigators for isolated sub-flows.

Frequently Asked Questions about flutter-routing-and-navigation

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

FAQPage Schema
What's the best way to implement Flutter navigation and deep linking for both mobile and web?

For advanced Flutter navigation and deep linking across mobile and web, use the declarative Router or go_router package to ensure URL synchronization and cross-platform consistency. Simpler apps can rely on imperative Navigator.push patterns.

How do I manage nested navigation flows with persistent bottom navigation in Flutter?

To manage nested navigation flows in Flutter, such as persistent bottom navigation or multi-step wizards, use nested Navigator stacks isolated via GlobalKey<NavigatorState> to maintain independent sub-flow histories.

When should I use Navigator.push versus go_router for Flutter screen transitions?

Use Navigator.push for simple screen transitions and data passing via RouteSettings in basic apps, but switch to go_router when you need advanced deep linking, web URL synchronization, or declarative routing logic.

How does Flutter handle passing data between screens during navigation?

Flutter handles passing data between screens during imperative navigation through constructor parameters or RouteSettings arguments, which require validation and safety checks to prevent null or typed route argument errors.

Why does my Flutter app close unexpectedly when navigating back with Navigator.pop?

Your Flutter app may close unintentionally if Navigator.pop is called on the root route; implementing proper validation and safety checks prevents this by ensuring the Navigator stack is handled correctly.

Does the Flutter Router package support web forward-button behavior and URL synchronization?

Yes, using the declarative Router or go_router package enables robust web URL synchronization and forward-button behavior, overcoming the deep linking limitations of basic named routes and onGenerateRoute.