Video: How to Build a Cosmic JS Extension Using Create React App


TL;DW

In this video I show you how to build a Cosmic JS Extension using Create React App.  Extensions offer a lot of power and flexibility.  With Extensions you can display your Bucket's contents with a custom UI, connect to third party APIs, and more.

For the Extension we are building in this video, we will be able to view a random cat in our Cosmic JS Bucket.  How is this specific Extension useful?  It's not (unless having a cat in your Bucket really makes your day)... BUT you can see how Extensions give you a lot of power and freedom to extend your Dashboard functionality.

To install a useful Extension to your Bucket in one click, go the the Extensions page, or view the docs for more info on how to create your own.

And if you really need an emergency cat in your Bucket, here's the Extension for download:

build.zip

And the code:

Was this article helpful?

Thank you! Your input helps us improve our articles and resources. If you have any other questions or comments, please contact support.

You may also like


Learn How to Preview Your Content in your Cosmic JS Bucket Dashboard 🚀
All of your images you upload to Cosmic JS are already transformed to imgix URLs, a powerful real-time image processing and CDN delivery solution. Let's take these images to the next level by optimizing image formats, compressing, intelligently cropping, & more!
Now editors can use the new Unsplash Photos Extension to find and add stock photography to their media library, all from the comfort of their Bucket Dashboard without having to interface with a third-party website like Unsplash.
In this tutorial, I'm going to show you how to create a elegant Recipe App using Vue2, Vuex, Vuetify and Cosmicjs.
Here we build a progressive web app in React.js with the power of Cosmic JS. It respond with status 200 and carries data when you disconnected to internet and in Chrome browser (both mobile and desktop) it gives an option to install the app on home screen.
In this tutorial, Cosmic JS co-founder Tony Spiro takes you on a tour of Cosmic JS Webhooks. Learn how webhooks work, see how to easily install integrations with Slack, auto-deploy websites to Netlify, and get an intro to Cosmic JS Functions.