Router en Gatsby y Componente Link

Gatsby nos facilita mucho la creación de páginas de nuestra aplicación. Solo debemos crear un archivo en la carpeta src/pages con el nombre de la página y automáticamente tendremos esa ruta disponible con el contenido del archivo.

Por ejemplo: Podremos ver contenido del archivo src/pages/index.js en la ruta / y el contenido del archivo src/pages/about.js en la ruta /about.

Además, Gatsby nos provee un componente <Link /> para navegar entre nuestras páginas. Funciona muy parecido a una etiqueta <a>, pero al dar click no recargaremos la página ni haremos peticiones al servidor, en cambio, podremos visualizar inmediatamente el contenido de la página a la cual queremos navegar. Todo esto gracias a que Gatsby tiene todas las funcionalidades de una Single Page Application.

Recuerda que estas funcionalidades del componente <Link /> solo funcionan en las páginas de nuestras aplicaciones con Gatsby. No podemos usarlo para navegar a otras aplicaciones.

Para usar este componente solo debes importarlo desde:

import { Link } from 'gatsby';