Skip to content

Basic Queries

Setup

The following code examples feature content from the Simple React Blog app template. You can run the code examples as is (copy + paste!) or install the demo content to your account then switch the values indicated with YOUR_BUCKET_SLUG and YOUR_BUCKET_READ_KEY to your Bucket access keys. You can find these values located in Bucket Settings > API Access after logging in to your Cosmic dashboard.

💡

Quick Tip
Use props to limit the payload size and get only the data you need. Omit this parameter to get the full response.

Get Objects by type

Get multiple Objects from your Cosmic Bucket using the type query parameter.

Step 1. Run the following commands to add the neccessary folder structure and dependencies.

mkdir cosmic-example
cd cosmic-example
yarn add cosmicjs

Step 2. Create index.js file with the following code.

const api = require('cosmicjs')() // empty init
const bucket = api.bucket({
  slug: 'simple-react-blog', // YOUR_BUCKET_SLUG
  read_key: 'bucket-read-key' // YOUR_BUCKET_READ_KEY
})
const app = async () => {
  const data = await bucket.getObjects({
    query: {
      type: 'posts'
    },
    props: 'slug,title,metadata.hero.imgix_url,metadata.author.title' // declare your response properties
  })
  const posts = data.objects
  console.log(JSON.stringify(posts, null, 2))
}
app()

Step 3. Run the app.

node index.js

Expected Result

[
  {
    "slug": "a-wonderful-blog-post-about-earth",
    "title": "A Wonderful Blog Post About Earth",
    "metadata": {
      "hero": {
        "imgix_url": "https://imgix.cosmicjs.com/56363630-af74-11e7-b864-313f959a776e-react-blog.jpg"
      },
      "author": {
        "title": "John Doe"
      }
    }
  },
  {
    "slug": "another-wonderful-blog-post-about-earth",
    "title": "Another Wonderful Blog Post About Earth",
    "metadata": {
      "hero": {
        "imgix_url": "https://imgix.cosmicjs.com/99fd6650-23f5-11e7-875c-3f5dc9c15c2b-beach.jpg"
      },
      "author": {
        "title": "Jane Doe"
      }
    }
  }
]

Get Object by slug

Get a single Object from your Cosmic Bucket using the slug query parameter.

Step 1. Run the following commands to add the neccessary folder structure and dependencies.

mkdir cosmic-single-example
cd cosmic-single-example
yarn add cosmicjs

Step 2. Create index.js file with the following code.

const api = require('cosmicjs')() // empty init
const bucket = api.bucket({
  slug: 'simple-react-blog', // YOUR_BUCKET_SLUG
  read_key: 'bucket-read-key' // YOUR_READ_KEY
})
const app = async () => {
  const data = await bucket.getObjects({
    query: {
      slug: 'a-wonderful-blog-post-about-earth'
    },
    props: 'slug,title,content,metadata.hero.imgix_url,metadata.author.title' // declare your response properties
  })
  const post = data.objects[0]
  console.log(JSON.stringify(post, null, 2))
}
app()

Step 3. Run the app.

node index.js

Expected Result

{
  "slug": "a-wonderful-blog-post-about-earth",
  "title": "A Wonderful Blog Post About Earth",
  "content": "<p>When I orbited the Earth in a spaceship, I saw for the first time how beautiful our planet is. Mankind, let us preserve and increase this beauty, and not destroy it!</p><p>Space, the final frontier. These are the voyages of the Starship Enterprise. Its five-year mission: to explore strange new worlds, to seek out new life and new civilizations, to boldly go where no man has gone before.</p><p>If you could see the earth illuminated when you were in a place as dark as night, it would look to you more splendid than the moon.</p><p>To be the first to enter the cosmos, to engage, single-handed, in an unprecedented duel with nature&mdash;could one dream of anything more?</p><p>We choose to go to the moon in this decade and do the other things, not because they are easy, but because they are hard, because that goal will serve to organize and measure the best of our energies and skills, because that challenge is one that we are willing to accept, one we are unwilling to postpone, and one which we intend to win.</p><p>NASA is not about the &lsquo;Adventure of Human Space Exploration&rsquo;&hellip;We won&rsquo;t be doing it just to get out there in space &ndash; we&rsquo;ll be doing it because the things we learn out there will be making life better for a lot of people who won&rsquo;t be able to go.</p><p>Problems look mighty small from 150 miles up.</p><p>That&#39;s one small step for [a] man, one giant leap for mankind.</p><p>Where ignorance lurks, so too do the frontiers of discovery and imagination.</p><p>Dinosaurs are extinct today because they lacked opposable thumbs and the brainpower to build a space program.</p>",
  "metadata": {
    "hero": {
      "imgix_url": "https://imgix.cosmicjs.com/56363630-af74-11e7-b864-313f959a776e-react-blog.jpg"
    },
    "author": {
      "title": "John Doe"
    }
  }
}

Next steps

💡

Learn More
Go to the queries section in the docs to learn more about Cosmic queries and available methods.