Masterclass Intermedio Gatsby

certificate
Recording and certification are available to Multipass and Full ticket holders only
Please login if you have one.
Rate this content
Bookmark

Con Gats v3 recién lanzado, aprende a construir sitios web modernos, eficientes y accesibles desde uno de los mantenedores del proyecto, Sid Chatterjee.

This workshop has been presented at React Summit Remote Edition 2021, check out the latest edition of this React Conference.

FAQ

Para iniciar un nuevo proyecto con Gatsby, puedes utilizar el comando `gatsby new` seguido del nombre del proyecto y opcionalmente una URL del starter que deseas utilizar. Por ejemplo: `gatsby new mi-nuevo-proyecto`.

Los starters en Gatsby son proyectos preconfigurados que proporcionan estructuras de proyecto y configuración básica para ayudarte a iniciar rápidamente nuevos proyectos de Gatsby. Puedes elegir un starter que se ajuste a tus necesidades específicas, como un blog o un sitio de comercio electrónico.

La integración con CMS en Gatsby se maneja a través de plugins específicos para cada sistema de gestión de contenido (CMS). Estos plugins facilitan la conexión entre Gatsby y el CMS, permitiendo obtener datos y utilizarlos en tu proyecto Gatsby.

Gatsby Cloud es una plataforma diseñada específicamente para proyectos Gatsby, ofreciendo servicios de construcción y alojamiento optimizados. Proporciona compilaciones rápidas, despliegues eficientes y una CDN global para mejorar la velocidad de carga del sitio.

En Gatsby, las imágenes se manejan a través del plugin `gatsby-plugin-image`, el cual optimiza automáticamente las imágenes para un rendimiento mejorado. Este plugin soporta carga perezosa, imágenes responsivas y genera múltiples versiones de cada imagen para diferentes dispositivos.

Para crear páginas dinámicas en Gatsby puedes utilizar la API `createPage` dentro de `gatsby-node.js`. Esta API permite definir dinámicamente las páginas basadas en datos, como entradas de un blog o productos de un catálogo.

Los themes de Gatsby son paquetes que encapsulan configuración de diseño y funcionalidad en proyectos Gatsby, permitiendo reutilizar y compartir configuraciones entre diferentes proyectos. Puedes instalar un theme como una dependencia y personalizarlo según tus necesidades.

Sid Chatterjee
Sid Chatterjee
207 min
16 Jun, 2021

Comments

Sign in or register to post your comment.

Video Summary and Transcription

El masterclass cubrió varios temas en Gatsby, incluyendo cómo empezar, crear páginas, usar GraphQL, agregar complementos de markdown, integrar CMS, explorar Gatsby Plugin Image, preservar el estado y el estilo, crear páginas del lado del cliente y desplegar con Gatsby Cloud. Los participantes encontraron y resolvieron problemas relacionados con la asignación de nombres de archivos, la representación de HTML, la consulta de contenido de markdown y la solución de problemas de integración de CMS. También se discutió la integración de TypeScript, los inicios y temas de Gatsby, y la depuración con registro detallado. Gatsby Cloud se destacó como una solución de alojamiento preferida para compilaciones y despliegues rápidos.
Available in English: Intermediate Gatsby
Video transcription and chapters available for users with access.

Watch more workshops on topic

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Nuevos modos de renderizado en Gatsby v4
React Advanced Conference 2021React Advanced Conference 2021
24 min
Nuevos modos de renderizado en Gatsby v4
Gatsby V4 introduces deferred static generation (DSG), combining the benefits of static site generation (SSG) and server-side rendering (SSR). This approach allows for faster builds and a more deterministic cache. Gatsby V4 also includes features such as parallel query running and LMDB for enhanced performance. The focus is on integrations and improving the developer experience (DX) in the future.
Tematizando aplicaciones Gatsby con Theme UI
React Summit 2020React Summit 2020
6 min
Tematizando aplicaciones Gatsby con Theme UI
Welcome to Theming Gatsby apps with Theme UI. Gatsby is a React-based framework for building static websites and applications. Theme UI is a styling library that allows developers to configure designs for components using predefined values. In Theme UI, you can easily refer to your theme object throughout your project. Variants allow you to define styles for common components like buttons.