Build Gatsby site with React and WordPress as a headless CMS

Build Gatsby site with React and WordPress as a headless CMS

Create a REAL WORLD Front End with Gatsby.js, React and WordPress as a Headless CMS!!

New Course
Course Instructor: Sarfaraz Kasmani

Course Outcomes

  • Setup a project from scratch with Gatsby CLI
  • Learn how to use GraphQL
  • Integrate WordPress as a headless CMS to Gatsby
  • Create website using Gatsby and WordPress(Headless CMS)

Course Structure

45 lectures4h 8m total duration

  Lecture 1 - Introduction 
2min
  Lecture 2 - Setup WP Site using Local by FlyWheel 
6min
  Lecture 3 - WP site and needed WP Plugins 
7min
  Lecture 4 - Short about tooling 
1min
  Lecture 5 - Create a new Gatsby Project with Gatsby CLI 
3min
  Lecture 6 - Install Dependencies 
2min
  Lecture 7 - Copy from Starter Files and cleanup 
11min
  Lecture 8 - Setup Gatsby plugins 
6min

About This Course

This course offers a comprehensive guide to using Gatsby.js with WordPress as a headless CMS, focusing on creating a real-world client front-end. It's designed for intermediate developers familiar with JavaScript and React, providing a fast-paced, project-oriented approach to learning Gatsby fundamentals. The course covers essential topics such as setting up a project from scratch with Gatsby CLI, integrating WordPress as a headless CMS, using GraphQL, and implementing React Hooks.

Throughout the course, you'll build a fully functional website based on a real client project, learning how to create blog archives, hero sections, and dynamic content. The instructor emphasizes practical, hands-on learning, guiding you through the process of connecting an existing WordPress site to Gatsby and using it as a headless CMS. While the course doesn't teach WordPress backend development or React basics, it provides an excellent opportunity to apply and expand your existing knowledge in a real-world context.

By the end of the course, you'll have gained valuable experience in creating high-performance, secure websites using Gatsby's static site generation capabilities combined with WordPress's content management features. You'll also learn how to publish your project to Gatsby Cloud with WebHooks and use the gatsby-source-wordpress plugin. This course is ideal for developers looking to enhance their skills in modern web development techniques and create faster, more flexible websites using headless WordPress architecture.

Used by learners at

Microsoft
Amazon
Google

Course Requirements

  • Basic knowledge of Javascript

Course Instructor

Sarfaraz Kasmani
Software Engineer and Digital Marketer
Sarfaraz Kasmani
4.5 Instructor rating
28 Ratings
298 Students
7 Courses

I am Sarfaraz Kasmani a Front End Developer and Digital Marketer from Mumbai, India. I am having more than 9 years of experience in the field of Front End Development and Digital Marketing. I'm excit...View profile

Upgrade to a Pro account and unlock more courses for accelerated learning. Instant feedback, interactive learning and more.

Free

  • 100+ coding courses
  • Certificate of completion
  • Hands-on practice
  • 24x7 doubt solving with AI
  • 100+ projects to practice
  • In-depth project feedback
  • AWS cloud sandboxes

Pro

  • 100+ coding courses
  • Certificate of completion
  • Hands-on practice
  • 24x7 doubt solving with AI
  • 100+ projects to practice
  • In-depth project feedback
  • AWS cloud sandboxes
Upgrade To Pro