Gatsby Wordpress full course 2021 | Gatsby for beginners | Wordpress as a headless CMS
Gatsby is using React (ReactJS) and GraphQL to create static sites that's blazing fast.
Learn how to combine Gatsby.js with Wordpress as a headless CMS. Wordpress as a headless CMS with WPGraphQL and GatsbyJS as the Front End. It is beginner friendly when starting out with Gatsby. Gatsby is a static site generator that is awesome and it's using #reactjs and #graphql
This is a full length premium course that clocks in at almost 6 hours of learning!
Starter files: https://github.com/weibenfalk/gatsby-...
You'll learn:
Setup a project from scratch with Gatsby CLI
GraphQL
Integrate WP as a headless CMS to Gatsby
React Hooks
Publish to Gatsby Cloud with WebHooks
gatsby-source-wordpress plugin
And much more ...
0:00 - Welcome
0:20 - The App
3:19 - Short about Gatsby
7:03 - Short about GraphQL
9:48 - Starter Files
15:04 - Setup WP Site using Local by FlyWheel
19:45 - Setup WP Site using Docker23:58 - WP Site and needed WP Plugins
29:54 - Short about tooling
32:15 - Choice - Start from scratch or use Starter Project
33:16 - Create a new Gatsby Project with Gatsby CLI
37:17 - Install Dependencies
44:00 - Copy from Starter Files and cleanup
52:38 - Setup Gatsby plugins
1:03:25 - Layout - Scaffold
1:11:25 - Layout - Hamburger
1:20:57 - Layout - GraphQL Query and custom hook
1:30:45 - Layout - Header
1:38:11 - Layout - Navigation
1:51:53 - Layout - Footer
1:56:13 - Layout - OverlayMenu
2:09:25 - Index - HeroImage - GraphQL query
2:17:19 - Index - HeroImage
2:26:15 - Index - CtaArea - GraphQL query
2:34:43 - Index - CtaArea
2:38:10 - Index - Cta
2:50:27 - Index - Latest Blog Post - GrqphQL query
2:54:19 - Index - Latest Blog Post
3:02:02 - Index - Quote - GraphQL query
3:05:32 - Index - Quote
3:12:40 - Index - About - GraphQL query
3:16:06 - Index - About
3:22:32 - Page - Create pages with the Route API
3:27:35 - Page - Scaffolding
3:32:07 - Page - Page query
3:44:21 - Page - PageHero
3:50:33 - Page - BreadCrumb
3:58:24 - Page - Sidebar and content
4:15:14 - Archive - Gatsby-node - GraphQL query
4:24:17 - Archive - Template scaffolding
4:29:10 - Archive - gatsby-node - Create Pages
4:42:04 - Archive - Template - Page Query
4:47:32 - Archive - Template - Hero Image and BreadCrumb
4:51:14 - Archive - Template - Sidebar
5:01:22 - Archive - Template - Content
5:06:22 - Archive - Template - Pagination
5:13:30 - Posts - Create post pages with the Route API
5:16:13 - Posts - Scaffolding
5:20:20 - Posts - Page query
5:23:43 - Posts - Sidebar and content
5:31:06 - Production Build
5:33:21 - Deploy to Gatsby Cloud with WebHooks
Support me by subscribing to this channel ❤️
Do you want to master #react, #gatsby, or #svelte fast? ⏩ 🚀 👩🚀
Check out my premium courses at https://www.weibenfalk.com
—
Find me somewhere below:
Website: https://www.weibenfalk.com
Udemy: https://www.udemy.com/user/thomas-928/
Linkedin: / thomas-weibenfalk-76356611
Twitter: / weibenfalk
Github: https://github.com/weibenfalk
FreeCodeCamp: https://www.freecodecamp.org/news/aut...
Dev.to: https://dev.to/weibenfalk
Смотрите видео Gatsby Wordpress full course 2021 | Gatsby for beginners | Wordpress as a headless CMS онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Weibenfalk 20 Июнь 2021, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 33,17 раз и оно понравилось 69 людям.