API-Powered Static Website
You get the best of all worlds:
- The flexibility to manage content from the Cosmic JS CMS API.
- The speed of static HTML.
- The option to use Markdown files.
How it Works
- The build process fetches content from the Cosmic JS API, then builds the static HTML files.
- Metalsmith transforms your Markdown into HTML pages.
- A light Node.js server is used to serve static files and perform rebuilds at the route
For further reading, check out the article How to Build an API-Powered, Static Website: The Best of Both Worlds.
Make sure you have yarn installed. Why? Because it's new, we love new, and it's provides quite a few improvements over the old
git clone https://github.com/cosmicjs/static-website cd static-website yarn
Your static site will now be serving static files from
/build at http://localhost:3000.
Rebuild the website at any time by accessing http://localhost:3000/rebuild-site.
Add / Edit Content
You can easily manage the content in your static site on Cosmic JS. Follow these steps:
- Log in to Cosmic JS.
- Create a bucket.
- Go to Your Bucket > Apps.
- Install the Static Website App.
- Deploy your Static Site to the Cosmic App Server at Your Bucket > Web Hosting.
Now you can edit your content and rebuild your static site on-the-fly by accessing
If you would like to rebuild your site after every content edit, this is made easy with Webhooks.
Click here for a tutorial on how to set up Webhooks.
To set up your Webhooks:
- Go to Your Bucket > Webhooks and add the Webhooks product to your bucket.
- Add a Webhook that is triggered when an object is published.
- Point the Webhook to