Autoplay
Autocomplete
HTML5
Flash
Player
Speed
Previous Lecture
Complete and continue
Gatsby with Wordpress as a headless CMS [2021]
Starter Files
Download Starter Files
Introduction
Introduction (0:20)
The Project App (2:59)
Short about Gatsby (3:43)
Short about GraphQL (2:45)
Setup WordPress site
Starter Files (5:16)
Setup WordPress site using Local by FlyWheel (4:40)
Optional - Setup WordPress site using Docker (4:13)
WordPress CMS and Plugins (5:56)
Setup Gatsby Project
Short about tooling (2:20)
Choice - Start from scratch or use Starter Project (1:00)
Create a new Gatsby Project with gatsby-cli (4:01)
Install npm Dependencies (6:43)
Copy from Starter Files and Cleanup (8:38)
Configure Gatsby Project
Setup Gatsby Plugins (10:46)
Layout Component
Layout - Scaffold (8:00)
Layout - Hamburger (9:31)
Layout - GraphQL Query and Custom Hook (9:48)
Layout - Header (7:26)
Layout - Navigation (13:41)
Layout - Footer (4:20)
Layout - OverlayMenu (13:11)
Home Page
index - HeroImage - GraphQL Query (7:54)
index - HeroImage (8:56)
index - CTAArea - GraphQL Query (8:28)
index - CTAArea (3:26)
Index - CTA (12:17)
index - Latest Blog Post - GraphQL Query (3:51)
index - LatestBlogPost (7:42)
index - Quote - GraphQL Query (3:30)
index - Quote (7:07)
index - About - GraphQL Query (3:25)
index - About (6:26)
Pages
Page - Create pages with the Route API (5:02)
Page - Scaffolding (4:32)
Page - Page Query (12:14)
Page - PageHero (6:11)
Page - BreadCrumb (7:51)
Page - Sidebar and Content (16:50)
Blog Archive
Archive - gatsby-node - GraphQL Query (9:03)
Archive - Template Scaffolding (4:52)
Archive - gatsby-node - Create Pages (12:54)
Archive - Template - Page Query (5:27)
Archive - Template - Hero Image and BreadCrumb (3:30)
Archive - Template - Sidebar (10:07)
Archive - Template - Content (5:00)
Archive - Template - Pagination (7:08)
Posts
Posts - Create post pages with the Route API (2:42)
Posts - Scaffolding (4:07)
Posts - Page Query (3:23)
Posts - Sidebar and Content (7:22)
Production Build and Deploy
Production Build (2:15)
Deploy to Gatsby Cloud with WebHooks (9:42)
Starter Files
Download