Flutter navigation / the field guide
Routes.
Without
detours.
Turn URLs into journeys. Deep links, nested stacks and authentication—mapped out, with the original guides kept in reach.
2026 edition · go_router 18.1.1 reference
Original EN + 日本語 guides preserved.
/ HomeScreen
/books BookListScreen
:bookId BookScreen
/settings SettingsScreen
/sign-in SignInScreen
An illustrative JavaScript URL matcher. No Dart is executed. Your entries stay in this browser.
01 / Build the mental model
A good route
has a reason.
Choose the question in front of you. Each guide connects the URL, the screen, and the way back.
Your first route
Connect a URL to a screen, then prove that the same destination works after a reload.
02go, push, and the way back
Use go for a destination described by your route tree; use push when you deliberately want another page on the current stack.
03Make the URL carry the right state
Read required identifiers from pathParameters and optional filters from state.uri.queryParameters.
04Redirect without losing the destination
Return a replacement location when a routing condition requires it; return null when navigation may proceed.
05Give every tab its own journey
Use StatefulShellRoute when parallel destinations need independent navigation histories and retained branch state.
06One destination, several entry points
A working web route and a verified Android or iOS app link are separate parts of the same user journey.
02 / Small beginning. Clear direction.
From a path
to a page.
Declare a destination. Read its identifier. Let the router rebuild the right screen from a link—even when no button was clicked first.
Understand the route tree ↗final router = GoRouter(
routes: [
GoRoute(path: '/', builder: (_, __) => const HomeScreen()),
GoRoute(
path: '/books/:bookId',
builder: (_, state) => BookScreen(
id: state.pathParameters['bookId']!,
),
),
],
);
MaterialApp.router(routerConfig: router);03 / The original map
History, without
the dead ends.
The early docs, Japanese translations, recordings and example source are back in reach. Old APIs stay in their own edition; the current guide shows the route forward.
Open the recovered collection ↗58 DOCUMENTATION + ILLUSTRATION FILES
ENGLISH + JAPANESE / SOURCE SNAPSHOT + RECOVERED HISTORY