Navegación en React Native: React Navigation y Expo Router

Las dos opciones principales en 2026

Para proyectos React Native nuevos en 2026, tenés dos opciones principales: React Navigation (el estándar histórico) y Expo Router (el nuevo estándar basado en archivos). En Deepyze migramos proyectos nuevos a Expo Router, aunque mantenemos React Navigation en proyectos existentes.

React Navigation

La librería de navegación más usada en React Native. Soporta Stack Navigator, Tab Navigator, Drawer Navigator y combinaciones. Instalación: npm install @react-navigation/native.

Stack Navigator básico

const Stack = createNativeStackNavigator();
function App() {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Home" component={HomeScreen} />
      <Stack.Screen name="Details" component={DetailsScreen} />
    </Stack.Navigator>
  );
}

Expo Router

Sistema de routing basado en archivos (similar a Next.js App Router). Cada archivo en la carpeta app/ es automáticamente una ruta. Ventajas: deep linking automático, URL sharing, mejor SEO si usás React Native Web.

Estructura de archivos

app/
  index.tsx        → "/"
  perfil.tsx       → "/perfil"
  settings/
    index.tsx      → "/settings"
    cuenta.tsx     → "/settings/cuenta"

Tab Navigator

Para la navegación principal con tabs en la parte inferior (estándar en iOS y Android). Se configura fácilmente con app/(tabs)/_layout.tsx en Expo Router.

Deep Linking

Permite abrir rutas específicas desde links externos (ej: notificaciones push que abren una pantalla específica). Expo Router lo configura automáticamente.

¿Necesitás ayuda con la arquitectura de navegación de tu app? Contactá a Deepyze.