React CMS Learn how to use Cosmic JS to power content for your projects using tools you love.

React

Cosmic JS makes it easy to manage content for your React applications. Get a feel for React by taking a spin through our React Apps and check out the tutorials below.

React CMS Articles

How to Build a Simple Blog Using React and GraphQL
How to Build a Cross-Platform Blog Using React Native and Node.js
Build an Appointment Scheduler Using React, Twilio and Cosmic JS
How to Build a Next.js React Universal App
How to Build a ToDo App Using React, Redux and Webpack
How to Build a Sticky Notes App Using React and Redux
Build a React Universal Blog in 4 Steps  
How to Build a React Website Powered by the Cosmic JS GraphQL API
Start a Premium Content Business Using Node.js, React and Cosmic JS Extensions

React CMS Resources

Video: How to Build a Cosmic JS Extension Using Create React App
Simple React Blog
Cosmic JS Docs
Official JavaScript Client
Cosmic JS GitHub

Using the Cosmic JS NPM Module

npm install cosmicjs --save

Then in your JavaScript file, get your content:

import Cosmic from 'cosmicjs';
const bucket = { slug: 'your-bucket-slug' };
Cosmic.getObjects({ bucket }, (err, res) => {
  console.log(res.objects);
});
React CMS

React Example with the GraphQL API