Using Content Management Systems With React

Articles & Tutorials

ReactJS vs PWA Studio vs Third-Party Themes: Which to Use on Magento 2 (onilab.com)
Aug 18, 2020
On this page, you can get acquainted with the use of ReactJS in Magento, the ways that it can be implemented, as well as the advantages and disadvantages of the listed options.
  • Alex Husar
  • Andrew Berzhinskiy
Why Frontend Developers Choose Gatsby Over Traditional CMS (blog.bitsrc.io)
Jun 16, 2020
Today, having a modern and attractive website is at the forefront of any business. Most of these websites are rich with content and provoking user interactions. You will find more unique designs, timely updated never than before.
  • Ashan Fernando
Building A Web App With Headless CMS And React (smashingmagazine.com)
Apr 01, 2020
This article introduces the concept of the headless CMS, a backend-only content management system that allows developers to create, store, manage and publish the content over an API. It gives developers the power to quickly build excellent user experiences, free from the worry of its impact on the back-end business logic.
  • Blessing Krofegha
Visual Open Authoring with Next.js & TinaCMS (dev.to)
Mar 10, 2020
We're focused on improving the independent web as a whole. We want to craft tools that help people build better sites and create better content. In line with this mission, we sought to create something we call Visual Open Authoring.
  • Scott Gallant
Exploring TinaCMS with Gatsby (alligator.io)
Jan 13, 2020
TinaCMS, when coupled with Gatsby, gives us to ability to manipulate our markdown files directly on our pages, visually. TinaCMS also works with Next.js, but here we’ll explore this powerful new tool with a Gatsby site.
  • Joshua Hall
3 ways to edit Markdown with TinaCMS + Gatsby (freecodecamp.org)
Jan 09, 2020
In this post, I will explore the three different methods Tina offers to edit Markdown on your Gatsby site. You’ll learn how to set up Tina with both Page Queries and Static Queries.
  • Thomas Weibenfalk
Using a headless CMS with React (blog.logrocket.com)
Dec 17, 2019
I did some research and discovered that a headless CMS is exactly what I need. It gives me an interface to write my blog posts along with the ability to deliver it anywhere I want. That sounds good, but which one do I go for? I know there are a lot of options out there.
  • Ovie Okeh
Managing content with Sanity (react.christmas)
Dec 06, 2019
Content management done the right way.
  • Henning Håkonsen
Content Management with Gatsby, Contentful & Netlify (itnext.io)
Feb 18, 2019
Gatsby, Contentful, Netlify — The Triple Threat For Content Management Success.
  • Babs Craig
Using Wordpress with React.js (dev.to)
Feb 18, 2019
In this article, we will cover how to use WordPress as a headless CMS by leveraging the WordPress API and React js when building a project.
  • Tim Smith
How to: Build a blog with Gatsby and GraphCMS (medium.com)
Feb 11, 2019
I want to show you how easy it can be to create an extremely fast and customizable blog site using some of the newest and greatest technologies in JavaScript today.
  • Tom Settle
Building Mobile Apps Using React Native And WordPress (smashingmagazine.com)
May 11, 2018
WordPress can work as an excellent back-end platform for your next native app, especially if it is content-driven or an online shop. In this article, you will learn the foundations for building mobile apps with React Native and WordPress.
  • Muhammad Muhsin
How To Build A Skin For Your Web App With React And WordPress (smashingmagazine.com)
Mar 07, 2018
If you’ve been looking for a content-driven solution, this article will explain how you can build a SPA WordPress theme with React.
  • Muhammad Muhsin
React.js with WordPress as a Backend: WP REST API Example (hackernoon.com)
Sep 19, 2017
WordPress Rest API is a huge step forward for frontend developers looking to combine the power of JavaScript tools like React.js with WordPress.
  • Maxime LaBoissonniere
Strapping React.js on a WordPress Backend: WP REST API Example (snipcart.com)
Sep 14, 2017
I'll use WordPress as a backend, and WordPress REST API to feed data into a simple React e-commerce SPA.
  • Maxime Laboissonniere

Video Guides & Talks

GraphCMS x Next.js | Working with getStaticProps, getStaticPaths and GraphQL (youtube.com)
Apr 10, 2020
In this video we will configure Next.js to programmatically create our product pages by querying data from GraphCMS at build time.
  • Jamie Barton
GraphCMS x Gatsby | Working with GraphQL, Gatsby Create Pages API (youtube.com)
Apr 09, 2020
In this video we programmatically create Product pages for products inside our GraphCMS project. We use Gatsby Create Pages API to do this, and fetch our GraphCMS data using the `gatsby-source-graphql` plugin.
  • Jamie Barton
Set up Strapi as a CMS for Gatsby (youtube.com)
Sep 05, 2019
Strapi is an open source, self-hosted Node.js headless CMS, which makes it a great option for setting up a Gatsby site. On this episode, David Kartuzinski (https://twitter.com/kai_dawei) joins to teach us how to set up Strapi from scratch to power a Gatsby site.
  • Jason Lengstorf
  • David Kartuzinski
Use Airtable as a CMS for Gatsby (youtube.com)
May 30, 2019
Airtable is like Excel with rocket boosters. Learn along with Jason as Giovanni Briggs from Airtable teaches us how to build a Gatsby site using Airtable as the CMS.
  • Jason Lengstorf
  • Giovanni Briggs
The Great Gatsby Bootcamp (youtube.com)
Apr 15, 2019
Learn how to create fast websites and web applications with Gatsby. You’ll use Gatsby, React, and GraphQL to build an entire CMS-powered website from scratch.
  • Andrew Mead
Multi-language websites with GraphCMS and Gatsby (youtube.com)
Feb 21, 2019
Learn how to build an internationalized website using GraphCMS and Gatsby.
  • Jason Lengstorf
  • Jesse Martin
Exploring The Wordpress REST API & React Integration (youtube.com)
Feb 10, 2019
In this video we will be looking at the Wordpress Rest API and how to navigate the response data, create custom post types, JWT authentication and we will do a bit of integration with React.
React-Based Content Management with Netlify CMS & Gatsby (youtube.com)
Mar 30, 2018
This talk will show how to use Netlify CMS with a Gatsby-based site, to build high-performant and infinitely-scalable sites with git-based content editing, a user friendly UI, and live browser previews - all without a backend.
  • Matt Biilmann

Courses & Video Series

React Native for Designers (designcode.io)
Feb 13, 2019
Learn to build an iOS and Android app from scratch. A 6-hour course teaching you custom animations, Styled Components, Redux, API data and adaptive layouts in React Native.
  • Meng To
Gatsby And Contentful - The Headless CMS Approach (youtube.com)
Feb 04, 2019
In this tutorial we'll start from scratch building a blog with Gatsby and Contentful.
  • Sebastian Eschweiler
Gatsby - Static Site Generator For React - Complete Guide (udemy.com)
Jan 12, 2019
Build Awesome Ultra-Fast Websites With React And GraphQL, Get Started With JAM Stack And The Headless CMS Approach.
  • Sebastian Eschweiler
Headless WordPress (leveluptutorials.com)
Apr 30, 2018
Learn how you can build a headless WordPress site with ease using both Next.js or Gatsby
Pro Gatsby (leveluptutorials.com)
Feb 26, 2018
In Pro Gatsby, you'll learn how to build extremely fast websites in React with the hottest static site generator around.