Presentación y Estructura de Archivos de nuestro proyecto: Platziswag

Clase 7 de 33Curso de Desarrollo de Aplicaciones Web con Gatsby JS

Resumen

Boilerplate de nuestro proyecto

Vamos a clonar el repositorio de github.com/Jossdz/Gatsby-platzi, de esta forma tendremos una estructura de archivos muy similar a la de gatsby new, pero esta vez con los estilos de nuestro proyecto listos:

git clone https://github.com/Jossdz/Gatsby-platzi

Archivos de configuración de Gatsby

  • package.json: los paquetes, scripts y la configuración principal de cualquier proyecto con Node.js.
  • gatsby-config.js: configuramos la metadata (título, descripción y autor) y los plugins de Gatsby que usaremos para construir nuestra aplicación.
  • gatsby-browser.js: una parte de nuestro código se construye desde el servidor, en el build time, y otra parte muy importante en el navegador, cada vez que los usuarios entran a nuestra aplicación. En este archivo podemos utilizar algunas APIs o métodos predefinidos para configurar el código que debe ejecutarse en el navegador, por ejemplo, para añadir vistas, cargar librerías o configurar un store global para manejar el estado.
  • gatsby-node.js: configuramos todo lo que tiene que ver con la construcción de nuestro sitio web con Gatsby. Podemos generar vistas en función de nuestra información proveniente de GraphQL, incluso utilizando APIs externas a nuestra aplicación.
  • gatsby-ssr.js: configuramos lo que sucede en el build time para que nuestra aplicación funcione correctamente en producción. Tiene el mismo fin que gatsby-browser.js, solo que este será el código que enviamos a producción.

El resto de archivos y carpetas contienen código JavaScript (seguramente con React) y CSS.