Building Static Sites with GatsbyJS

Paths

Building Static Sites with GatsbyJS

Authors: Marcelo Pastorino, Deeksha Sharma

GatsbyJS is a React-based, GraphQL powered, static site generator. It lets you create fast, rich web experiences that integrate all your favorite services and content. You can... Read more

  • GatsbyJS fundamentals
  • Consuming data with GatsbyJS
  • Testing and deploy GatsbyJS sites
  • Creating plugins, themes and starters with GatsbyJS

Pre-requisites

  • HTML
  • CSS
  • JavaScript

Building Static Sites with GatsbyJS

GatsbyJS is a React-based, GraphQL powered, static site generator. It lets you create fast, rich web experiences that integrate all your favorite services and content. You can build e-commerce sites, landing pages, blogs and more in just minutes. In this path you will learn how to build, test and deploy your own Gatsby sites.

GatsbyJS: The Big Picture

by Marcelo Pastorino

Dec 22, 2020 / 51m

51m

Start Course
Description

There are many ways to build websites and web applications nowadays.

GatsbyJS is an opinionated open source framework based on React that offers performance, scalability, and security out of the box.

In this course, GatsbyJS: The Big Picture, you’ll learn everything there is to know to understand and evaluate this amazing technology.

First, you’ll explore the building blocks of the JAMStack architecture and GatsbyJS.

Next, you’ll discover how easy it is to start creating new projects with Gatsby and discover GatsbyJS code syntax and conventions.

Finally, you’ll learn about Gatsby’s tooling and fantastic ecosystem.

When you’re finished with this course, you’ll understand GatsbyJS building blocks and be able to determine whether this technology is the right fit for your next project.

Table of contents
  1. Course Overview
  2. Understanding the JAMStack Architecture
  3. Understanding GatsbyJS
  4. Understanding GatsbyJS Site Structure, Code, and Data Access Capabilities
  5. Understanding GatsbyJS Ecosystem

GatsbyJS: Getting Started

by Marcelo Pastorino

Feb 28, 2019 / 2h 11s

2h 11s

Start Course
Description

Creating modern static sites with GatsbyJS, React, and GraphQL can be easy and this course will show you how. In this course, GatsbyJS: Getting Started, you will gain the foundational knowledge needed to create modern static sites using GatsbyJS. First, you will learn what the JAMStack is, the basics of GatsbyJS, and how to start using this amazing technology. Next, you will discover how Gatsby makes use of React to create reusable components, the building block in a GatsbyJS site, and learn how to create React components of your own. Finally, you will explore GraphQL and its importance in the Gatsby ecosystem, as well as how to query for data using this versatile technology. When you finish this course, you will have created a modern and complete static blog site in Gatsby, as well as acquired the skills and knowledge needed to create other type of sites with GatsbyJS, using React and GraphQL.

Table of contents
  1. Course Overview
  2. Introducing GatsbyJS
  3. Creating Static Pages
  4. Styling in Gatsby
  5. Creating Components
  6. Querying Data with GraphQL
  7. Handling Data with Source and Transformer Plugins
  8. Creating Dynamic Pages Programmatically
  9. Deploying a Gatsby Site

Coming Soon

Consuming Data with GatsbyJS

Coming Soon

by Marcelo Pastorino

Testing and Deploying GatsbyJS Applications: Playbook

by Deeksha Sharma

Mar 16, 2021 / 1h 24m

1h 24m

Start Course
Description

Developing Gatsby applications using a modern stack, tools, and plugins is a powerful skill but not sufficient. It should be coupled with rigorous testing, continuous integration, deployment workflows, working knowledge of hosting platforms, and an ability to debug builds and optimize the overall performance. In this course, Testing and Deploying GatsbyJS Applications: Playbook, you’ll learn to deploy blazing fast, reliably tested, and a performant cafe website developed using Gatsby. First, you’ll explore how to add unit and end-to-end tests within the website codebase. Next, you’ll discover how to automate the build, test, and deployment of the site using GitHub actions. Then, you will see how to host the site on Gatsby Cloud, CloudFront, Netlify, and other platforms. Finally, you’ll learn how to debug the issues within your Gatsby build and fine-tune the site performance. When you’re finished with this course, you’ll have the skills and knowledge of efficient packaging, testing, and deployment skills needed to deliver fast, fully tested, and high-performance, seamless Gatsby applications.

Table of contents
  1. Course Overview
  2. Unit Testing of Gatsby Site
  3. Hosting Your Gatsby Site
  4. End-to-end Testing of Gatsby Site
  5. Continuous Deployment and Site Optimization

Coming Soon

Creating Plugins, Themes and Starters with GatsbyJS: Playbook

Coming Soon

by Kamran Ayub