In this blog, we will walk through the steps of publishing websites using cosmic with 21YunBox.


Steps to deploy publish websites using Cosmic with 21YunBox:

  1. Sign up on 21YunBox
  2. Create or use existing cosmic space.
  3. Fork Cosmic Starter on Github
  4. Use the following values during creation:
Runtime Static Site
Build Command yarn && yarn build
Publish Directory ./public


Click Advanced Configuration to add below environment variables:

KEY VALUE
Cosmic_SPACE_ID You can find it on Cosmic Dashboard -> “Settings” -> API Keys -> “Space ID”
Cosmic_ACCESS_TOKEN You can find it on Cosmic Dashboard -> “Settings” -> API Keys -> “Content Delivery API - access token”

Here are the screenshots of finding the space ID and the access token for Cosmic.




If you are using 21YunBox to preview (before you publish the content live to the public), you can use the “Content Preview API - access token” instead. This gives you the flexibility to preview internally.

That’s it! Your website will be live on your 21YunBox URL as soon as the build finishes.


Cosmic Starter: https://cosmic.21cloudbox.com/
Cosmic Starter: https://cosmic.21cloudbox.com/


So what happens if I add new content on Cosmic, do I need to redo the steps above?

What you need to do is to press the purple deploy button on the 21YunBox console, then the 21YunBox Build system will pull the content from the Cosmic server and deploy it once it’s done building.

Press the purple deploy button on 21YunBox to publish new content from Cosmic
Press the purple deploy button on 21YunBox to publish new content from Cosmic

If you want to automate it, you can follow the steps below to configure it.

Steps to setup auto-publish with Cosmic and 21YunBox

1. On Cosmic Dashboard, select the project you want to auto-publish

2. Click “Settings” -> “Webhooks”

3. Then Configure it using:

  • “Event”: “Object created and published”,

  • “Endpoint”: You can find the build webhook URL on 21YunBox Console. See above screenshot for reference.

4. Save the webhook.

That’s it! Now when new content publishes on Cosmic, 21YunBox will automatically build and deploy the changes for you.