What is Expo Router?

Expo Router is a file-based routing system for React Native and web (built on top of React Navigation). Files in the app/ directory automatically become routes — exactly like Next.js for React Native. Directory structure → routes: app/ _layout.tsx // Root layout (NavigationContainer equivalent) index.tsx // "/" route -- home (tabs)/(home)/index.tsx // Tab: home (tabs)/(profile)/index.tsx // Tab: profile users/ [id].tsx // Dynamic route: /users/123 profile.tsx // /profile _layout.tsx // Nested layout. Special files: _layout.tsx — defines layout for a directory (Stack, Tabs, Drawer). index.tsx — matches the directory's root route. +not-found.tsx — 404 page. (groupName)/ — route group (doesn't affect URL). Navigation: import { Link, useRouter, useLocalSearchParams } from "expo-router"; // Declarative: <Link href="/users/123">View User</Link> <Link href={{ pathname: "/users/[id]", params: { id: "123" }}}> <Text>User Profile</Text> </Link> // Programmatic: const router = useRouter(); router.push("/home"); router.replace("/login"); router.back(); // Params: const { id } = useLocalSearchParams();. Tab layout example: // app/(tabs)/_layout.tsx: export default function TabsLayout() { return ( <Tabs> <Tabs.Screen name="index" options={{ title: "Home", tabBarIcon: ({ color }) => <Icon name="home" color={color} /> }} /> </Tabs> ); }. Deep linking: automatic — URLs match the file structure. Works on web natively. Typed routes (Expo SDK 50+): TypeScript knows all valid routes — compile-time navigation type safety.