• Stars
    star
    275
  • Rank 149,796 (Top 3 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 9 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

*API v2 JavaScript client for Cosmic. See important message in README

Cosmic NPM module (dashboard v1)

IMPORTANT

This package connects to projects on the old Cosmic dashboard and API v2 only. To connect to projects on the new Cosmic dashboard and API v3 use the Cosmic JavaScript SDK.

Content management made simple, fast, and secure.

Cosmic is a headless CMS (content management system) that provides a web dashboard to create content and an API toolkit to deliver content to any website or application. Build nearly any type of content model using our admin dashboard then deliver your content powered by our reliable infrastructure and global CDN.

Save time and launch faster

Avoid the pain of building, configuring, and maintaining your own CMS infrastructure. Cosmic has all of the features you need out of the box optimized and ready. Plug into Cosmic, save time, and launch your content-powered apps faster.

Features include

🛠️  Powerful content modeling
🔍  Flexible queries
  Customized API response
🌎  Localization
🎨  Image optimization
…and more! See more features →

Get started

Start by going to https://www.cosmicjs.com, create your free account and set up a project. You can get started from scratch, or start with a pre-built template. Then follow the steps below to use this NPM package.

Install

Install the Cosmic NPM module:

pnpm install cosmicjs
# OR
yarn add cosmicjs
# OR
npm install cosmicjs

Import

Import Cosmic into your app:

const Cosmic = require("cosmicjs")
const api = Cosmic()

Connect

In your Cosmic admin dashboard go to Your Bucket > Settings > API Access and get your Bucket slug and read key then set the variables in your app to connect to your Bucket:

const bucket = api.bucket({
  slug: "YOUR_BUCKET_SLUG",
  read_key: "YOUR_BUCKET_READ_KEY",
})

Get content

Delivering content to your app is simple using the objects.find method.

Get multiple Objects

Use the objects.find method and set the type property to any Object Type slug. Additional options noted below.

const data = await bucket.objects.find({
  type: "products" // Object Type slug
})
.props("title,slug,metadata") // response properties
.limit(10) // number of Objects to be returned

Get single Object by slug

Use the objects.find method and set the slug property to any Object slug.

const data = await bucket.objects.find({
  type: "pages", // Object Type slug
  slug: "home", // Object slug
  locale: "en", // optional, if localization set on Objects
})
.props("title,slug,metadata") // response properties

More examples

For more in-depth guides on getting Cosmic data into your app, you can view these basic query examples. When you are ready to level up, check out advanced query examples.

Add content

The Cosmic API is fully CRUD (create, read, update, delete) capable, enabling user-generated content and file uploads. Check out the add Object and add media examples in the documentation.

Further documentation

See the full documentation for more requests and capabilities.

Community support

For general help, please refer to the official Cosmic documentation. For additional help, you can use one of these channels to ask a question:

  • Slack (For live discussions with the Cosmic community and team)
  • GitHub (Bug reports, contributions)
  • Twitter (Get the latest news about Cosmic features and notifications)
  • YouTube (Learn from video tutorials)

License

This project is published under the MIT license.

More Repositories

1

nodejs-website-boilerplate

A Node.js website boilerplate that satisfies some common website requirements.
CSS
176
star
2

appointment-scheduler

An appointment scheduler built using React, Twilio and Cosmic
JavaScript
134
star
3

simple-react-blog

A simple blog website powered by Next.js and Cosmic.
TypeScript
124
star
4

vue-music-website

Music website built with Vue.js and Cosmic JS
Vue
101
star
5

nextjs-website-boilerplate

A Next.js website boilerplate that satisfies some common website requirements.
JavaScript
95
star
6

cosmicapp-voting-app

A voting app built using React, MobX and Cosmic JS
JavaScript
73
star
7

simple-blog

A simple blog website powered by Node.js and Cosmic JS
HTML
67
star
8

unft-marketplace

A digital art marketplace built using Next.js, Stripe, and Cosmic.
JavaScript
65
star
9

cross-platform-blog

A cross-platform blog for iOS, Android and web. Content powered by Cosmic JS.
CSS
64
star
10

nuxtjs-website-boilerplate

A Nuxt.js website boilerplate that satisfies some common website requirements.
Vue
61
star
11

nuxt.js-website

Nuxt.js website example using Cosmic JS
Vue
55
star
12

user-management

A user management example app
CSS
54
star
13

nextjs-restaurant-website-cms

A restaurant website template built with Next.js and Cosmic
JavaScript
52
star
14

simple-astro-blog

A simple astro blog powered by the Cosmic CMS
Astro
51
star
15

static-website

API-Powered Static Website
CSS
51
star
16

vuejs-photo-gallery

A Vue.js Photo Gallery Powered by Cosmic JS
JavaScript
48
star
17

ecommerce-app

An Angular JS Ecommerce App Powered by Cosmic JS
HTML
48
star
18

react-native-twitter-clone

A React Native Twitter clone built using Cosmic JS
JavaScript
47
star
19

cosmic-media-extension

Search millions of high-quality royalty-free stock photos, images, and videos from popular online media services.
TypeScript
46
star
20

simple-nextjs-blog

A simple blog powered by Next.js and the Cosmic headless CMS
TypeScript
44
star
21

nextjs-developer-portfolio

A developer portfolio template powered by the Cosmic headless CMS.
JavaScript
38
star
22

cosmicapp-real-estate

A basic real estate website powered by Cosmic JS
CSS
37
star
23

facebook-bot

A Facebook Bot Reminder App
JavaScript
37
star
24

vue-blog-netlify-template

A Vue.js blog powered by Cosmic. Deploy to Netlify in one click.
JavaScript
36
star
25

react-website-boilerplate

A React website boilerplate that satisfies some common website requirements.
JavaScript
36
star
26

next.js-website

Next.js website example using Cosmic
JavaScript
33
star
27

inventory-app

Inventory management app powered by Vue.js, Laravel and Cosmic JS
PHP
31
star
28

vuetify-blog

A blog built with Vue, Vuetify, and Cosmic JS
Vue
28
star
29

nodejs-chat-app

Full Stack Chat Application with SMS configuration.
JavaScript
26
star
30

vue-garage-sale

PWA application for online sell/buy marketplace using Vue.js and Cosmic JS
Vue
26
star
31

email-capture

A simple landing page for lead email capture to MailChimp.
CSS
26
star
32

cosmicapp-photography-website

A photography website template built using Node.js and the Cosmic JS CMS API
CSS
25
star
33

gatsby-blog-cosmicjs

🚀⚡️ Blazing fast blog built with Gatsby and the Cosmic Headless CMS 🔥
JavaScript
25
star
34

cosmic-podcast-network

A podcast network website powered by the Cosmic CMS and Next.js.
TypeScript
25
star
35

ember-real-estate-website

A real estate website built using Ember.js and Cosmic JS
JavaScript
23
star
36

todo-app

A React / Redux To Do app powered by Cosmic JS
CSS
23
star
37

react-blog

Cosmic, React, Redux, Node
JavaScript
23
star
38

angular-blog

A Blog built using Angular and the Cosmic headless CMS
CSS
22
star
39

vue-rpg-game

Vue RPG Game powered by Cosmic JS
JavaScript
21
star
40

sticky-notes

A sticky note app built using React, Redux and powered by Cosmic JS.
JavaScript
19
star
41

landing-page

A simple Node.js landing page powered by Cosmic JS
CSS
18
star
42

gatsby-agency-portfolio

Portfolio client designed with creative agencies in mind.
JavaScript
18
star
43

react-portfolio-website

Photograph portfolio-website using react. Content api powered by Cosmic JS
CSS
17
star
44

angular-company-website

Simple yet flexible website for a company or freelancer. Build with Angular and Cosmic JS.
TypeScript
17
star
45

blocks

React components for building Cosmic powered websites and apps.
TypeScript
17
star
46

cosmic-cli

The official command line tool for Cosmic
JavaScript
16
star
47

react-pwa

A progressive web app using React and Cosmic JS
JavaScript
16
star
48

notetoself

Command line note taking app
JavaScript
16
star
49

gatsby-starter

Install a Cosmic-powered Gatsby app in seconds 🔥
JavaScript
15
star
50

staticwebsitehosting

Static Website Hosting is a leaderboard of the top static website hosting providers for static websites.
JavaScript
15
star
51

portfolio-website

GraphQL-powered Portfolio Website
CSS
14
star
52

react-book-app

Book App built using React and Redux with content powered by Cosmic JS
JavaScript
14
star
53

react-starter

Install a Cosmic-powered React app in seconds 🔥
JavaScript
14
star
54

cosmic-sdk-js

The official JavaScript SDK for Cosmic. Use it to power content server-side, in the browser, and in native apps.
TypeScript
14
star
55

vue-starter

Install a Cosmic-powered Vue.js app in seconds 🔥
Vue
13
star
56

react-news-app

A minimal news blog boilerplate powered by React and the Cosmic API.
JavaScript
13
star
57

nuxt-jamstack-website

JAMstack Website that uses Vue.js, Nuxt.js and Cosmic JS
Vue
13
star
58

agency-template

A website template built using Cosmic's React components, Blocks.
TypeScript
12
star
59

creative-agency

A website for a creative agency built using Node.js and Cosmic JS
JavaScript
11
star
60

vue-website-boilerplate

A Vue website boilerplate that satisfies some common website requirements.
Vue
11
star
61

react-graphql-static-site

React GraphQL-powered Static Website
JavaScript
11
star
62

react-graphql-blog

A React Blog Powered by the Cosmic JS GraphQL API
JavaScript
10
star
63

serverless-starter

Install a Cosmic-powered Serverless app in seconds 🔥
JavaScript
10
star
64

portfolio-platform

A platform that enables management of multiple portfolio websites
HTML
9
star
65

gridsome-blog

Blazing fast blog built using Gridsome that utilizes the power of Cosmic.
Vue
9
star
66

cosmicapp-future-imperfect

A Node.js blog application
CSS
9
star
67

react-static-blog

Blazing fast blog built using React Static that utilizes the power of Cosmic JS
JavaScript
9
star
68

react-spotify-blog

Cosmic JS based music blog with integrated spotify player allowing user to shuffle albums.
JavaScript
9
star
69

cosmic-commerce-filters

Ecommerce App with Personalization using Angular and Cosmic
TypeScript
9
star
70

cosmicapp-stellar

A single page web app with a light Node.js server and connected to Cosmic JS
CSS
9
star
71

bitblog

Monetize your content with crowd-sourced cryptocurrency mining. Think of it as an alternative to advertising.
HTML
9
star
72

go-cosmic-blog

Example blog built with Go and the Cosmic Headless CMS 🔥
Go
9
star
73

hacker-news-top-stories

View and save top Hacker News stories to your Cosmic Bucket
JavaScript
8
star
74

react-cosmedium-blog

Blog layout inspired by Medium.com
JavaScript
8
star
75

cosmic-docs

Cosmic API v2 docs
JavaScript
8
star
76

medium-backup

Automatically backup your Medium articles to Cosmic JS
JavaScript
8
star
77

nodejs-sales-page

A Node.js sales landing page with A/B testing. Content powered by Cosmic JS
HTML
8
star
78

gatsby-source-cosmicjs

DEPRECATED Follow the link below to the new source plugin
JavaScript
8
star
79

node-starter

Install a Cosmic-powered Node.js app in seconds 🔥
JavaScript
7
star
80

blazor-blog

🚀 Blazing fast blog built using Blazor that utilizes the power of Cosmic 🔥
HTML
7
star
81

nextjs-non-profit-website

A simple template to get started with a non-profit website. Uses Next.js and Cosmic headless CMS.
TypeScript
7
star
82

content-grabber

Web Content Grabber Chrome Extension
JavaScript
7
star
83

cosmicjs-php

The official PHP client for Cosmic JS. This module will help you easily add dynamic content to your website or application.
PHP
7
star
84

cosmicjs-examples

Website examples using the Cosmic JS content management platform.
7
star
85

band-website

A band website built using Express and Cosmic JS.
CSS
7
star
86

mux-extension

Add the power of Mux video processing to your Cosmic Bucket
Vue
6
star
87

wordpress-post-importer

Import posts from any WordPress website into your Cosmic Bucket in a few clicks
JavaScript
6
star
88

vuejs-store-locator

Store locator using Vue.js, Vuex, Google Maps API, and Cosmic JS
JavaScript
6
star
89

send-email-function

Cosmic Function to send emails using SendGrid
JavaScript
6
star
90

svelte-todo

Todo List app built using Svelte and Cosmic
HTML
6
star
91

cross-platform-blog-web

This is the web mirror of the Cross-Platform Blog for deployment purposes only.
CSS
6
star
92

rest-api-docs

OLD DOCS ==== Go to the new docs ===== ➡️
JavaScript
6
star
93

gatsby-docs-app

Create and view documentation using Gatsby and Cosmic JS
CSS
6
star
94

cosmicapp-slide-deck

Cosmic JS - powered slide deck. Built ontop of the Impress.js presentation framework.
JavaScript
6
star
95

cosmic-sdk-swift

A pure Swift interpretation of the Cosmic JavaScript SDK for use in Swift and SwiftUI projects.
Swift
6
star
96

react-vr-art-gallery

React VR app powered by Cosmic JS
JavaScript
5
star
97

cosmicjs-wp-export

WordPress Export Plugin for Cosmic JS.
PHP
5
star
98

ionic-angular-app

A simple product catalog mobile app built with Angular JS, Ionic and Cosmic JS
JavaScript
5
star
99

angular-ecommerce-personalization

Angular ecommerce website customization sample, working with headless CMS Cosmic JS
TypeScript
5
star
100

angular-emoji-game

An Angular Emoji Game managed by Cosmic JS
JavaScript
5
star