Principio fundamental del funcionamiento del framework NextJS
En lecciones anteriores, instalamos el framework NextJS y nos familiarizamos con su estructura básica. Es hora de ponernos a trabajar en lo principal.
La parte principal de NextJS es el enrutamiento (routing). El enrutamiento funciona así: cuando un usuario ingresa una URL en la barra de direcciones del navegador, el framework NextJS entregará al navegador un archivo específico, correspondiente a esa URL.
El enrutamiento en NextJS está organizado de una manera especial.
Su esencia consiste en que a cada
URL solicitada le corresponde una
carpeta dentro de src/app.
Además, dentro de la carpeta debe haber
un archivo con el nombre page.jsx.
Precisamente este archivo será el que se entregue
al navegador. Y en este archivo
escribiremos código en JSX, mientras que al navegador
se enviará el código HTML listo de la página.
Veamos un ejemplo.
Supongamos que queremos que en la URL /test/
se muestre un determinado texto.
Creemos la carpeta correspondiente: src/app/test.
Dentro de esta carpeta, creemos el archivo page.jsx
con el siguiente contenido:
export default function Test() {
return <h1>hello, user!</h1>;
}
Abra en el navegador nuestra URL: /test. Y verá el texto escrito por nosotros dentro del archivo JSX.
Intente cambiar el texto y guardar el archivo. Después de esto, el texto automáticamente cambiará también en el navegador. Así funciona NextJS en modo de desarrollo.
Haga que al acceder a la dirección
/about se muestre en el navegador
un mensaje con su nombre y
apellido.