Gatsby Static Site Generator Tutorial

Course Contents

(0:00:00) Intro
(0:00:56) Gatsby Info
(0:02:46) Course Structure
(0:03:28) Course Requirements
(0:05:09) Vs Code
(0:06:02) Module Intro
(0:07:29) Install Gatsby-Cli
(0:09:29) Setup New Gatsby Project
(0:15:07) Folder Structure
(0:29:42) First Page
(0:38:26) Error Page
(0:41:01) Nested Structure
(0:44:41) Links
(0:51:21) Navbar
(0:56:26) Layout Component
(1:05:44) CSS Module Intro
(1:06:47) Inline CSS
(1:08:27) Global CSS
(1:14:01) CSS Naming Issues
(1:17:50) CSS Modules
(1:28:04) Styled-Components
(1:40:51) House Cleaning
(1:48:33) Styles
(1:53:05) Footer
(1:56:31) Error Page
(1:57:38) Contact Page
(2:03:45) Assets And Icons
(2:10:56) Navbar Setup
(2:20:11) Navbar Logic
(2:24:51) Gatsby Image Info
(2:28:30) Sandbox Setup
(2:34:36) Install Plugin
(2:38:15) Static Image Setup
(2:45:41) Shared Props And Options
(2:50:20) Options Example
(2:58:10) All Layouts
(3:04:29) Height
(3:09:04) About Page
(3:18:56) Hero Page
(3:25:19) Gatsby And GraphQL Intro
(3:28:39) Gatsby DataLayer In A Nutshell
(3:30:20) GraphiQL Interface
(3:36:35) SiteMetadata
(3:42:14) First Query
(3:51:27) Explorer
(3:53:52) Static Query Vs Page Query
(3:55:18) UseStaticQuery Hook – Code Exporter
(4:01:34) UseStaticQuery, GraphQL – From Scratch
(4:12:05) Field Alias
(4:15:06) Query Keyword, Name And Gatsby Clean
(4:18:19) Page Query
(4:25:20) Install SOURCE-FILESYSTEM Plugin
(4:35:33) AllFile Field
(4:41:50) Query Arguments
(4:50:03) Static Path Fix
(4:51:26) File – Field
(4:54:48) SourceInstanceName – Argument
(4:56:56) Gallery Setup
(5:00:47) GatsbyImageData – Field
(5:08:56) Render Gallery
(5:20:41) GetImage – Helper Function
(5:25:23) Local VS External Data
(5:26:50) Headless CMS
(5:28:49) Contentful
(5:29:37) Setup Contentful Account
(5:33:14) Content-Type
(5:40:07) Content
(5:47:36) Connect Gatsby – Contentful
(5:52:36) ENV Variables
(5:58:48) AllContentfulRecipe – Field
(6:05:57) AllRecipes Component
(6:15:00) RecipesList Component
(6:26:59) Featured Recipes
(6:37:50) Utils Setup
(6:42:47) Helper Function
(6:50:27) TagsList
(6:54:14) Tags Page
(7:00:22) Recipe Template Page Setup
(7:04:57) Recipe Template Page Walkthrough
(7:14:00) Slugify
(7:18:15) Query Variables
(7:27:05) Recipe Template Query
(7:34:27) Recipe Template Return
(7:46:45) GATSBY-NODE.JS Setup
(7:50:43) Create Tag Pages Programmatically
(8:08:36) Tag Template Return
(8:20:07) Possible Bug Fix
(8:26:53) Fonts
(8:32:40) Contact Form
(8:37:16) FAVICON
(8:39:23) SEO Setup
(8:45:40) SEO – Props
(8:51:34) SEO – Complete
(9:01:05) Netlify Info
(9:01:58) Netlify – Drag And Drop
(9:05:32) Continuous Deployment
(9:14:44) Webhooks