Navigation & Routing

React Navigation Setup

Install React Navigation dan dependencies:

bash
npm install @react-navigation/native
npm install react-native-screens react-native-safe-area-context
npm install @react-navigation/bottom-tabs

Stack Navigation

Sequential screen transitions dengan back button.

jsx
const Stack = createNativeStackNavigator();

<Stack.Navigator>
  <Stack.Screen name="Home" component={HomeScreen} />
  <Stack.Screen name="Details" component={DetailsScreen} />
</Stack.Navigator>

Tab Navigation

Bottom tabs atau top tabs untuk switch antara screens.

jsx
const Tab = createBottomTabNavigator();

<Tab.Navigator>
  <Tab.Screen name="Home" component={HomeScreen} />
  <Tab.Screen name="Settings" component={SettingsScreen} />
</Tab.Navigator>

Drawer Navigation

Hamburger menu untuk navigation.

Passing Parameters

Navigate dengan data:

jsx
navigation.navigate('Details', { id: 123 })

Deep Linking

Link langsung ke screen tertentu dari external apps atau URLs.

Navigation State

Access dan manipulate navigation state dengan hooks.