Cosmic JS Blog Stay tuned for community news, company announcements and updates from the Cosmic JS team.

Introducing Gatsby Preview for Cosmic JS


by Tony Spiro on November 26, 2019

This article was originally published on the Gatsby Blog.

We’re excited to announce the official release of Gatsby Preview for Cosmic JS. This new integration enables you to add powerful content preview functionality to your Cosmic JS Gatsby website.


Getting Started

  1. First go to the Gatsby Getting Started Page and follow the links for Cosmic JS.
  2. Select the Cosmic JS-powered Gatsby Blog
  3. You will then be asked for your GitHub and Cosmic JS authentication, so make sure you have both accounts set up (sign up for Cosmic JS here).
  4. After onboarding, go to any Post in your Cosmic JS Bucket and find the big, beautiful, purple button to preview your content. 


Cosmic JS Gatsby Preview Screenshot


What happens?

After clicking the “Open Preview” button, a new tab will open to instantly show you what the content looks like for this specific version on your Gatsby website. This simple one-click preview will greatly enhance your content team’s content-creation workflow.

Cosmic JS Gatsby Preview Screenshot


How did this integration happen?

The Cosmic JS / Gatsby Preview integration is the result of close collaboration between both teams to make the integration as easy as possible. Both sides had to refactor a bit of existing functionality to make it seamless. And the feedback that came from the collaboration effort actually helped to improve both products. We’re happy to say this powerful feature can be integrated in just a few clicks.


Why is this a big deal?

Both Gatsby and Cosmic JS believe deeply in providing developers the best development experience possible. But it’s not just about developers. Content creation team members are crucial to building great web products. And one of the most requested features for content creators is preview, but this has been a challenge for developer teams pushing for highly-optimized JAMStack websites built on Gatsby.

Gatsby Preview solves this problem by providing a simple button for content creators to experience an instant preview of content directly in the CMS dashboard. Gatsby preview with the Cosmic JS headless CMS, is a further extension to empower content creators to preview content quickly and easily, giving teams faster content marketing velocity.


What’s next?

We’re excited to continue to work closely with the Gatsby team to help create more value-added integrations between both services. It’s our goal to continue to provide the full spectrum of team members the best tools to be successful.

Our users have been very helpful with letting us know ways to improve the Cosmic JS + Gatsby stack combo. So if you have any suggestions on ways we can improve, please let us know in the Cosmic JS Slack channel or on our Twitter.


Happy building!

— Tony and the Cosmic Team

You may also like


We're happy to announce that you now have the ability to publish your Objects at a later date and time.

If you’re a developer and need to open up a new blog for yourself or a client, the idea of using Wordpress probably makes you cringe.

At Cosmic, it's our mission to help teams of developers and content creators build great content-powered apps together. We're happy to announce the new Additional Users Add-On to offer a flexible pricing option for growing teams.

What if I told you there is a faster, and more optimized way to bundle the language data for your small web-application? And what if, I also told you that you can use a remote Content Management System (CMS), that can manage your website’s content?


Cosmic JS now gives you the ability to add different user roles to your bucket.  The different roles available are:

Admin
Has access to settings, users and developer features.

Developer
Has access to developer features and editor features.

Editor
Can add, edit and delete content with developer features hidden.

As an Admin or Developer, this makes it easier to share Cosmic JS with the Editor on your team.  For the Editor role, the powerful developer features are hidden and allows them to focus on their job of managing content.  Sign in to your Cosmic JS account to add your team and collaborate on building something great, now even easier.

We hope you enjoy the new JSON Metafield to provide you even more flexibility for storing application data for your Cosmic-powered applications.