Más allá de lo básico
Este manual ha cubierto los fundamentos: configurar un proyecto, componentes, JSX, estilos, props, state, eventos, formularios, efectos, y los hooks que los conectan, junto con la forma de pensar en React para convertir un diseño en una app funcional y el trabajo de mantener esa app accesible. Ese es el núcleo de la librería, y es suficiente para construir interfaces reales y funcionales. Hay algunos temas que quedan fuera de ese núcleo, y casi toda app de React en producción termina usando una combinación de ellos tarde o temprano. Este capítulo es el mapa: para qué sirve cada uno, dónde encaja, y dónde ir a aprender.
Ruteo
Una app de una sola página renderiza todo en el navegador e intercambia lo que está en pantalla en lugar de pedirle al servidor una página nueva cada vez. Eso es parte de lo que la hace sentir rápida, pero también significa que la navegación usual del navegador—escribir una URL, hacer clic atrás, guardar una página—no tiene dónde conectarse a menos que algo la construya. El ruteo es esa pieza: mapea una URL a la vista que debe mostrarse, mantiene la barra de direcciones sincronizada mientras el usuario se mueve, y mantiene funcionando el botón atrás, todo sin recargar la página completa. React Router es la librería que la mayoría de apps de React usa para esto.
Meta-frameworks
React en sí solo renderiza la interfaz. No ofrece una opinión sobre ruteo, cómo cargar datos antes de que aparezca una página, o cómo renderizar una página en el servidor antes de que llegue al navegador—tres cosas que casi toda app en producción necesita. Un meta-framework es un framework construido sobre React que proporciona esas piezas faltantes, y Next.js es el que la mayoría del mundo de React usa. Por eso la mayoría de apps de React en producción no son solo React: son React ejecutándose dentro de Next.js o algo similar. Los tipos de frameworks cubre los meta-frameworks con más profundidad, incluyendo cómo Next.js se relaciona con React.
Herramientas
Esta pieza ya tiene su propio capítulo. Configurar un proyecto de React explicó por qué el JSX usado en todo este manual no es JavaScript válido por sí solo, y cómo Vite ejecuta un servidor de desarrollo, compila JSX al vuelo, y empaqueta todo en archivos optimizados cuando llega el momento de poner en producción. Pertenece a este mapa porque está debajo de todo lo demás aquí: un router, un meta-framework, y un paso de despliegue todos asumen que ya hay una herramienta de construcción haciendo ese trabajo. Vuelve al capítulo de configuración cuando quieras los detalles de nuevo.
Despliegue
Una vez que la app está construida, necesita un hogar. Ejecutar un comando de construcción, vite build para un proyecto de Vite, produce una carpeta de archivos de HTML, CSS y JavaScript simples: la salida estática de la app. Enviar esa carpeta a un host, como Netlify, Vercel o Cloudflare Pages, es lo que pone la app en internet para que otras personas la usen.
Dónde esto te deja
Ese es el mapa: ruteo para moverte entre vistas, un meta-framework como Next.js para manejar lo que React deja fuera, la construcción de Vite del capítulo de configuración convirtiendo el código en archivos que el navegador puede cargar, y un host para poner el resultado en línea. Nada de esto necesita aprenderse hoy. Elegir y aprender un framework es la guía para decidir si y cuándo agregar una pieza como Next.js, y cómo pesar las opciones una vez que llegue ese momento. La forma más rápida de pasar por todo esto es el mismo enfoque que te ha traído hasta aquí: construye un pequeño proyecto real. Elige algo que valga la pena hacer, apóyate en los fundamentos de este manual, y trae las piezas de arriba solo una vez que el proyecto las pida.
