Getting Started

Get started quickly adding Cosmic-powered content to your websites and apps.

Speaking Cosmic

What is a Bucket?

A Bucket is the main piece in the Cosmic content structure. It's very flexible and can power the content for an entire website or a portion of a website. Since your Bucket content is delivered via an API endpoint, your Bucket can also power content for any application including iOS, Android, tvOS, Apple Watch, IOT, AR/VR or any other way that you would like to distribute your content. You may need multiple Buckets for different environments (for example one Bucket for Staging, one Bucket for Production, etc).

What is an Object Type?

An Object Type is any collection of Objects that share a similar function. Pages, articles, projects, etc.

What is an Object?

An Object can be a page, a blog post, or anything you want it to be. Cosmic gives you the freedom to create and manage content openly and create your own data structure. Each Object allows for the creation of a title, slug, content and Metafields.

What are Metafields?

Metafields are very powerful pieces of custom data. Current available Metafield types include: text, textarea, HTML textarea, select dropown, image / file upload, date, single Object relationship, multiple Object relationship, radio buttons, check boxes, markdown, parent with nested children, repeater, and JSON. Your created Metafields are transformed into key/values stored as Metadata in the API endpoints.

Current Metafield Options

Quickstart

Install the Cosmic NPM module to integrate content into any new or existing website or app.

There are guides for React, Node.js, Vue.js, Next.js, and more in the Cosmic docs. Or install some simple starters using the Cosmic CLI below:

npm i -g cosmic-cli
cosmic init node-starter
cd node-starter
cosmic start

Code Examples

Along with our REST and GraphQL APIs, we also provide select client libraries. Below are a few examples of how these client libraries can be used to add dynamic content to your apps.

Node.js Example

Install the Official Cosmic JavaScript Client on NPM.

npm i cosmicjs

Then get your content:

Browser Example

Use the Unpkg hosted browser file or add the cosmicjs.browser.min.js file from the Official Cosmic JavaScript Client on GitHub to your app. Here is a real working example application:

React Example

Edit nextjs-cms-example

Cosmic CLI

Use the Cosmic CLI to communicate directly with your Cosmic account via the command line. Below are a few quick examples.

Install the CLI globally:

npm i -g cosmic-cli

View all available commands:

cosmic

Log in to your Cosmic account:

$ cosmic login
  ? Email: starman@gmail.com
  ? Password: [hidden]
Authenticated

Connect to a Bucket:

cosmic use-bucket simple-react-blog

Get Objects from the connected Bucket:

$ cosmic get-objects --limit 1
      Success
      { objects: 
          [ { _id: '59df6dd5fd8d731b2100118d',
              bucket: '59df6dcbfd8d731b21001188',
              slug: 'jane-doe',
              title: 'Jane Doe',
              content: '

Something about Jane...

', metafields: [Array], type_slug: 'authors', created: '2017-10-12T13:27:49.663Z', created_at: '2017-10-12T13:27:49.663Z', status: 'published', metadata: [Object] } ], limit: 1 }

Go to the Cosmic CLI NPM module page to see more examples.

Documentation

Find more getting started guides in the Cosmic docs.

Go to the docs →

Get Started with Cosmic

Build personal projects for free. Add your team at unbeatable prices.
Start Building Talk to Sales