Gatsby Tutorial - Navbar & Links

In this Gatsby tutorial we'll create a navbar component to sit at the top of each page & also use the Link component to link to each page.

Gatsby Tutorial - Pages & Routes

In this Gatsby tutorial we'll talk about how to create pages (page components) and the routes generated for those pages.

Manage Subscriptions with Gatsby, Netlify, Stripe, & Hasura - Part 1 - Colbyashi Maru

Learn how to build a subscription management app with Gatsby, Netlify, Stripe, & Hasura.

Gatsby Tutorial - Starter Sites

In this Gatsby tutorial we'll take a look at Gatsby starter sites & choose a bare-bones "hello world" starter to create a new project.

Static Site Generators: A Beginner's Guide

Static-site generators are a key element of the modern Jamstack architecture. We explore the standout features of seven leading static-site generators: Gatsby; Next.js; Hugo; Nuxt.js; Jekyll; Eleventy; VuePress; Nuxt.js or VuePress?

Page Redirect With Gatsby

Everything you wanted to know about redirects in Gatsby.js and more

How To Become A Better Developer In 2021

This video in a guide on how to become a better developer i year 2021 The author explained some reasons that will improve and increase our coding skills <iframe width="560" height="315" src=""...

How to Add Dark Mode to a Gatsby Site 🌑

Learn how to add dark mode to a Gatsby Site 🌑 Simply Install the plugin with npm install gatsby-plugin-dark-mode. This plugin provides you with a React component for implementing theme toggling in your site.

4 JavaScript Frameworks You Should Consider For Your Next Web App

With Pros & Cons For Each4 JavaScript frameworks you should consider trying out for your next web app: Express.js; Next.js; Gatsby.js; Nuxt.js

How To Handle Images with GraphQL and the Gatsby Image API

You are going to compress, transform, and style images using the Gatsby Image API and GraphQL queries. By using GraphQL queries in Gatsby.js projects, you can use the Gatsby Image API to take care of image compression, make an image responsive, and even handle basic image styling. In this tutorial, you are going to compress, transform, and style images

Code a Portfolio Website from Scratch with Gatsby.js

In this series of tutorials we'll show you how to code a portfolio website from Scratch with Gatsby.js

A Complete Guide To Gatsby + React

Gatsby is a robust and fast static site generator, which uses React to render static content on the web. We are going to explain how Gatsby works. Gatsby is a free and open source framework based on React that helps developers build blazing fast websites and applications.

Sanity CMS for Headless Content Management in Gatsby

Sanity is a backend (headless) CMS that can be used with Gatbsy for a structured approach to managing web content and data. We will discuss using the headless CMS, Sanity, with Gatsby to improve site efficiency, productivity, and speed through a structured approach to content management.

How To Build and Host a React/Gatsby Portfolio Website In 5 Minutes

In this video, we go through how to set up and host a portfolio website using gatsby and react in 5 minutes.

Guess.js and Gatsby Site Optimization

Learn how to integrate Guess.js into a Gatsby site to increase site efficiency and improve UX. Gatsby.js offers great performance optimization right out of the box. Guess.js is a collection of libraries and tools that enhances user experience using predictive analytics.

Gatsby with Wordpress | Graphiql Editor and Custom Hook

Gatsby with Wordpress as a headless CMS. I'll show how to build a query with the graphiql playground and use the query in a custom hook in Gatsby.

Gatsby Blog With Mapbox GL JS Using React Hooks

I love making websites with Gatsbyjs and recently started using Mapbox, so I thought I could combine the two. It was a really great exercise for me to get familiar with Gatsby and Mabpx GL JS API as well as using React hooks with functional components. The idea is to create a travel blog where the map will support the text content by dynamically zooming into the area of interest and putting markers of the places from a blog post. When navigating between different posts, the map will continuously highlight the new areas instead of refreshing the whole map each time. This will give a better spatial context to the readers.

Building a WordPress Website with React (Frontity)

We will work you through the process of building a WordPress website with Frontity. Frontity is a free and open-source framework with a focus on WordPress that helps you build a React-based frontend for a headless (or decoupled) WordPress site. Although React frameworks like Gatsby.js and Next.js work with WordPress, none of them is exclusively focusing on WordPress. Frontity eliminates all these pain-staking and additional tooling developers have to do and gets you to the development stage faster.

From Brittle to Supple: How Gatsby and MDX Made Our Documentation Smoothly

How Gatsby and MDX Made Our Documentation Smoothly Inclusive. In this talk, you’ll learn how we streamlined our component library documentation tooling with Gatsby and MDX. Pair this with inclusive best practices, and your component library documentation will be silky smooth.

Build a Responsive Website using React, Gatsby, and GraphQL

Learn how to build a responsive website using React, Gatsby, and GraphQL. The site is fully responsive and has animations. We will use Gatsby Image to optimize our images automatically and GraphQL to query the files. Also, we will use styled components to design the website.