<section name="79ef"><h2>TL;DR</h2><a href="https://cosmicjs.com/apps/multi-language-survey/demo">View the demo</a> <a href="https://github.com/cosmicjs/multi-language-survey" rel="noopener noreferrer" target="_blank">View the codebase on GitHub</a> <a href="https://cosmicjs.com/apps/multi-language-survey">Install the app</a>Sometimes when surveying customers, there is a good chance that not all of them speak the same language that you do. As a result, it might be difficult to survey customers outside the regional area that you do most of your sales.This is especially in true in markets where you are working on a national or even international scale. The flexibility to meet the demands of your customers should be top priority, and a language barrier should not exist between the most important part
of any business: customer feedback.I was recently tasked with creating an application for Cosmic, and the concept I came up with was an application that enables businesses and developers to survey on a multi-locale basis.</section><section name="ff23"><h3 name="fc00">Before we&nbsp;begin</h3><figure name="c92d"><img data-image-id="1*-tf-L-8oeZROPxgQS-1q3A.png" data-width="1194" data-height="789" src="https://cdn-images-1.medium.com/max/800/1*-tf-L-8oeZROPxgQS-1q3A.png" class="fr-fic fr-dii"><figcaption style="text-align: center;">The Cosmic homepage (as of late 2017)</figcaption> </figure>Cosmic is a remote CMS service that lets you manage localized content externally from you application, allowing the changes you make to take immediate effect within your application. If you intend on modifying the survey&rsquo;s values you&rsquo;ll need a &nbsp;
<a data-href="https://cosmicjs.com/" href="https://cosmicjs.com/" rel="noopener" target="_blank">Cosmic account</a>. They offer free plans that you can use, as well as a 2 week trial to test it out without any restrictions.Regardless, you&rsquo;ll need to have a working development environment with <a data-href="https://nodejs.org" href="https://nodejs.org" rel="noopener" target="_blank">Node.js and npm installed</a>. This project uses some technologies such as Babel, Webpack, Bootstrap and React, so experience with those technologies is beneficial if you are planning to customize the front-end of the project.</section><section name="9ce5"><h3 name="dc7b">Installing the&nbsp;demo</h3>The demo GitHub project is located at <a href="https://github.com/cosmicjs/multi-language-survey">https://github.com/cosmicjs/multi-language-survey</a>. Either clone the repository with <code>git clone</code> or download the project manually using the download button on the repository page.Once the project is downloaded (and extracted if you downloaded an archive), <code>cd</code> into the project directory and then download the project dependencies with the command <code>npm install</code>. Once that is done, you should now be able to
build the project.Before we go through some the project details, build the development
version with the command <code>npm run dbuild</code>. The built application should then be available inside the <code>build/</code> directory.</section><section name="9cf8"><h3 name="84f5">Running the survey (back-end)</h3><figure name="ec20"><img data-image-id="1*4ScqJwjlZhi-hrVsTu8xYg.png" data-width="815" data-height="487" src="https://cdn-images-1.medium.com/max/800/1*4ScqJwjlZhi-hrVsTu8xYg.png" class="fr-fic fr-dii"><figcaption style="text-align: center;">A glimpse at what the application looks like by default.</figcaption> </figure>Now that we have the application built locally, running <code>npm run server</code> will automatically start the express server at <code>localhost:3000</code>. You can navigate to it from your web browser.</section><section name="07a3"><h3 name="ef3d">App structure</h3><figure name="f9f5"><img data-image-id="1*91Rd6I2vEbpnjERuoSJHEA.png" data-width="311" data-height="637" src="https://cdn-images-1.medium.com/max/600/1*91Rd6I2vEbpnjERuoSJHEA.png" class="fr-fic fr-dii"><figcaption>The default project structure after a successful build</figcaption></figure>There are three main sections to the application:&nbsp;The <code>build/</code> directory, which houses all of the built project files, as well as the public directory for the web server.The <code>src/</code> directory contains the React components for the front end of the project. It also contains a <code>util.js</code> file, which acts as a simple filtering library to filter out HTML entities output sent from the back-end server.The <code>survey/</code> directory contains the back-end Node.js code for transforming and outputting localized survey data to the front-end. It&rsquo;s also responsible for fetching the data from the remote Cosmic server.The file <code>template.js</code> contains the base template for the survey. This file should be updated when you wish to modify the survey using the <a data-href="https://surveyjs.io/Overview/Library/" href="https://surveyjs.io/Overview/Library/" rel="noopener" target="_blank">Survey.js</a> syntax.Key files in the root project directory include the <code><a data-href="https://github.com/cosmicjs/static-multi-language-app/blob/master/config.js" href="https://github.com/cosmicjs/static-multi-language-app/blob/master/config.js" rel="noopener" target="_blank">config.js</a></code>file, which contains the configuration for both the Cosmic API fetcher script, as well as the webpack build configuration <code>webpack.config.js</code>.</section><section name="1d49"><h3 name="775a">Modifying the&nbsp;survey</h3><blockquote name="f74e">Currently, the survey API only supports a specific subset of locales due to limitations of the Survey.js library. These locales are&nbsp;<code>ar, zh-Hans, cs, da, nl, en, fi, fr, de, el, hu, is, it, lv, fa, pl, pt, ro, ru, es, sv, and tr.</code></blockquote>The default locale is specified within the <code>src/app.js</code> file as the default <code>currentLocale</code> state initialized (which by default is simply <code>en</code> ).<figure name="0f82"><img data-image-id="1*NGz9c1Y8CaoYC7BqbOQ26g.png" data-width="1920" data-height="880" src="https://cdn-images-1.medium.com/max/1000/1*NGz9c1Y8CaoYC7BqbOQ26g.png" class="fr-fic fr-dii"><figcaption style="text-align: center;">An example of the Dashboard &gt; Questions</figcaption> </figure>If you activated the demo on the Cosmic website, you should already have two bucket types available: Questions and Nodes. Questions are objects that contain the necessary data for use as survey questions, while Nodes are simply localized values for use within the app (or as the titles of specific quiz pages).Each Question requires three essential parts, the <code>slug</code>, the <code>locale</code> , and the <code>content</code> field. The locale is critical, since the server will only process data for the matching locale. Without the locale specified, the server will discard the data as unneeded and the values will not be processed. &nbsp;&nbsp;<figure name="b428"><img data-image-id="1*gHx40TV0UDlZ31C3hFA4lQ.png" data-width="1373" data-height="694" src="https://cdn-images-1.medium.com/max/1000/1*gHx40TV0UDlZ31C3hFA4lQ.png" class="fr-fic fr-dii"></figure>Within the template (which will be mentioned shortly), the slug corresponds directly with a <code>%name-of-slug%</code> The content field expects a <code>p</code> element, and a <code>ul</code> (unordered-bullet list) containing a list of <code>li</code>(list items). Each list item corresponds with the <code>%X%</code> within the specified question&hellip;Confused? Don&rsquo;t sweat it. We&rsquo;ll be going over an example right now.Here is a example <code>survey/template.js</code> file containing matching values for the above:When the locale data is fetched by the user, the server iterates through each question object, and converts it to JSON. Once this is done, the matching <code>%symbol%</code> is replaced with the corresponding values on the remote Cosmic server.&nbsp;<blockquote name="3b2a">Thankfully, by default the Cosmic remote API converts special characters into HTML entities, so they won&rsquo;t affect the processing of JSON.</blockquote>The <code>title</code> property depends on a Node value (which is simply the text contents of a specific <code>slug</code> found with the Nodes objects menu. So a title with the value <code>%first-page-title%</code> would directly correspond to a Node with a slug value of <code>first-page-title</code>.Depending on the locale selected (in this case <code>en</code>), the result will resemble the following:&nbsp;In addition to the above, all defined Nodes (with the appropriate locale set) will be rendered into the <code>langData</code> state on the front end of the application. It contains an object of name-value pairs, so the syntax would resemble something like this:This allows you to include specific localized strings within you application.</section><section name="2d5c"><h3 name="a002">In closing</h3>I am again, amazed at how flexible and easy the API is to work with as a developer. Being someone who has worked with WordPress sites with clients before, knowing that a service like this exists brings a sense of ease.&nbsp;The best part about the Cosmic API is how ultimately it&rsquo;s just raw data. You can manipulate that data to meet the specific needs of your app, <a data-href="https://hackernoon.com/cosmic-js-with-static-web-applications-c291d3dd4b33" href="https://hackernoon.com/cosmic-js-with-static-web-applications-c291d3dd4b33" rel="noopener" target="_blank">even if it&rsquo;s not a live app</a>. I look forward to seeing how this technology grows and becomes the industry standard.</section><section name="5f03"> </section>

Build a multi-language survey with Cosmic + Survey.js

We are excited to roll out new updates to the <a href="https://www.npmjs.com/package/cosmicjs" rel="noopener noreferrer" target="_blank">Cosmic NPM module</a> (v4.2.*). This update adds new chain-style methods (Note: there are no breaking changes). Review the updates below.<h3>Getting Started</h3>Get started by installing the latest module version <code>npm install cosmicjs@latest</code> then import the package into your app.<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/0981b1071c0e460e65ef5d0573fe9fb3' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/0981b1071c0e460e65ef5d0573fe9fb3" class="embedly-card"></a></div>Then set your Bucket slug and read key. These can be found in Your Bucket &gt; Settings &gt; API Access after <a href="https://app.cosmicjs.com" rel="noopener noreferrer" target="_blank">logging in</a> to your Cosmic dashboard.<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/0822dc167019b36af44a4b76080302b6' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/0822dc167019b36af44a4b76080302b6" class="embedly-card"></a></div>Now use the new chain methods to find, add, edit, and delete Objects and Media in your Bucket.<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/74a96b2971453f1052c5fe17948dfd1d' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/74a96b2971453f1052c5fe17948dfd1d" class="embedly-card"></a></div><h3>Changes</h3><ul><li>Updated the NPM module to v4.2.*</li><li>Chain methods are now available</li><li>Breaking changes: none</li></ul><h3>What&#39;s new</h3><ol><li>Added chain methods for Objects:</li></ol><ul><li><code>bucket.objects.find</code></li><li><code>bucket.objects.findOne</code></li><li><code>bucket.objects.insertOne</code></li><li><code>bucket.objects.updateOne</code></li><li><code>bucket.objects.deleteOne</code></li></ul><ol start="2"><li>Added chain methods for Media:</li></ol><ul><li><code>bucket.media.find</code></li><li><code>bucket.media.findOne</code></li><li><code>bucket.media.insertOne</code></li><li><code>bucket.media.deleteOne</code></li></ul><h3>Old methods</h3>For the old npm-v4.1.19 methods, see the <a href="https://cosmic-docs-qmeqawlpd-cosmicjs.vercel.app/" target="_blank">docs version for npm-v4.1.19</a>. These methods include:<ol><li>Objects</li></ol><ul><li><code>bucket.getObjects</code></li><li><code>bucket.getObject</code></li><li><code>bucket.addObject</code></li><li><code>bucket.editObject</code></li><li><code>bucket.deleteObject</code></li></ul><ol start="2"><li>Media</li></ol><ul><li><code>bucket.getMedia</code></li><li><code>bucket.getSingleMedia</code></li><li><code>bucket.addMedia</code></li><li><code>bucket.deleteMedia</code></li></ul> We hope you enjoy these new methods for using the <a href="https://www.npmjs.com/package/cosmicjs" rel="noopener noreferrer" target="_blank">Cosmic NPM module</a>. Review all of the methods now available in <a href="https://docs.cosmicjs.com/" rel="noopener noreferrer" target="_blank">the Cosmic docs</a>. To stay up with the latest updates to Cosmic, <a href="https://twitter.com/cosmicjs" rel="noopener noreferrer" target="_blank">follow us on Twitter</a>, <a href="https://www.youtube.com/cosmicjs" rel="noopener noreferrer" target="_blank">subscribe on YouTube</a>, <a href="https://cosmicslack.herokuapp.com/" rel="noopener noreferrer" target="_blank">join us on Slack</a>.

NPM module updates - v4.2.*

We&#39;ve added <a href="https://docs.cosmicjs.com/examples/basic-queries">new examples</a> to the Cosmic documentation to help you learn common Cosmic API methods and use cases. The new examples feature simple copy + paste code for Node.js, cURL, GraphQL, and the Cosmic CLI.You can run the following code as is or add your Bucket access keys to connect to your Bucket content. Learn all of the available examples and follow along with the code examples below which use the <a href="https://www.npmjs.com/package/cosmicjs" rel="noopener noreferrer" target="_blank">Cosmic NPM module</a>. <video autoplay="" class="fr-draggable fr-fvc fr-dvi card-shadow video-popout lazy-load" data-video="https://cdn.cosmicjs.com/811ea110-e297-11ec-9f15-f79bd5847752-docs-examples.mp4" loop="" muted="" playsinline="" style="width:100%;">Your browser does not support HTML5 video.</video>Go to the <a href="https://docs.cosmicjs.com/examples/basic-queries" rel="noopener noreferrer" target="_blank">Cosmic docs&nbsp;</a>to check out the new examples.<h3> </h3><h3>Setup &amp; running Node.js</h3>To run the following code examples, make sure you have <a href="https://nodejs.org/en/download/" rel="noopener noreferrer" target="_blank">Node.js installed</a> on your machine. Then run the following setup commands in your terminal to make the Cosmic NPM module available in a new Node.js project:<pre>mkdir cosmic-example
cd cosmic-example
yarn add cosmicjs</pre>Add any of the code examples below to an <code>index.js</code> file and run node to see the results:<pre>node index.js</pre><h3> </h3><h3>Basic queries</h3>The <a href="https://docs.cosmicjs.com/examples/basic-queries">basic queries</a> show you how to get a list of Objects in your Bucket by Object Type as well as getting a single Object in your Bucket by Object slug.Get Objects by type:<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/5de0961d810a82cf9282482854ac5395' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/5de0961d810a82cf9282482854ac5395" class="embedly-card"></a></div>Get single Object by slug:<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/30217c0955585ae0affb7dc4878869ae' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/30217c0955585ae0affb7dc4878869ae" class="embedly-card"></a></div><h3>Advanced queries</h3>The <a href="https://docs.cosmicjs.com/examples/advanced-queries">advanced queries</a> show you some of the capabilities to get content by more detailed search options such as metadata values, <code>$gte</code> (greater than or equal to), <code>$lte</code>(less than or equal to), <code>$ne</code> (not equal to), and more.Search Objects by metadata value:<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/b3c236fac796cb46779e72cd0f741939' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/b3c236fac796cb46779e72cd0f741939" class="embedly-card"></a></div>Search Objects by metadata number value less than or equal to using <code>$lte</code>:<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/3ecf80f412201ec2931b226d3365a220' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/3ecf80f412201ec2931b226d3365a220" class="embedly-card"></a></div>Search Objects not equal to metadata value using <code>$ne</code>:<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/720251f08bea3ce9bb82987ed26caeed' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/720251f08bea3ce9bb82987ed26caeed" class="embedly-card"></a></div>Check out more examples of advanced queries <a href="https://docs.cosmicjs.com/examples/advanced-queries">in the docs</a>.<h3> Other Examples</h3>Other examples include <a href="https://docs.cosmicjs.com/examples/add-object">adding a new Object</a> and <a href="https://docs.cosmicjs.com/examples/add-media#add-media-using-react-dropzone">uploading media</a> using React Dropzone. &nbsp;Copy + paste the code, add your Bucket access keys, and run the code to learn how to add content to your Cosmic Bucket. We hope you enjoy these additions to our extensive documentation to help you better implement Cosmic-powered content into your websites and apps. Check out the <a href="https://docs.cosmicjs.com/examples/basic-queries">Cosmic docs examples section</a> and let us know what you think!

New docs examples

Cosmic Functions, which <a href="https://www.cosmicjs.com/blog/introducing-cosmic-functions" rel="noopener noreferrer" target="_blank">we announced back in 2018</a>, is now scheduled for deprecation. When will it be removed? If you have used this feature, it is scheduled for removal in the current dashboard (and will not be included in the <a href="https://app-v2.cosmicjs.com" rel="noopener noreferrer" target="_blank">new dashboard</a>).You can continue to use the feature until the removal date. The date for removal from all new and existing Buckets is March 29, 2022** This will not affect any aspects of the core content management product or service. ** If you have already deployed functions to your AWS account through Cosmic, this will not affect the status of those functions. You will still be able to manage your functions through AWS. Why is it being deprecated? At the time we released Cosmic Functions, there were not a lot of options to deploy simple serverless functions easily in a dashboard interface. We actually used it quite a bit for some use cases internally, but they proved to not be very useful for our customers. And today there appears to be more (better) options in the marketplace for serverless function deployment including Serverless, Netlify, Vercel, and more.We have decided to sunset the feature so we can focus more efforts on our core content management and delivery products and services. Contact Us If you have any questions or concerns about the removal of this feature please <a href="mailto:support@cosmicjs.com" rel="noopener noreferrer" target="_blank">contact support</a>.Thank you, Tony Spiro Cosmic CEO

Deprecation of Cosmic Functions

You can now set <code>props</code> on webhooks to limit the data payload. This is useful for Objects with large data payloads as it allows you to limit the payload to just the data you need.How to use the new feature See the <a href="https://docs.cosmicjs.com/api-reference/objects#using-props">props section in the Cosmic docs</a> to learn more about how to use props. Go to Your Bucket &gt; Settings &gt; Webhooks after <a href="https://app.cosmicjs.com/login">logging in</a> to use the new feature.Let&#39;s look at a couple of example webhook payloads with and without props.Without Props You get the full data payload.<div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/9bfa3a4034c8461dfd74b6df66e32986' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/9bfa3a4034c8461dfd74b6df66e32986" class="embedly-card"></a></div>That&#39;s a lot of data! Do you need it all? Maybe not. Enter props. With Props Get only the data you need. This example sets <code>slug,title,metadata</code><img src="https://cdn.cosmicjs.com/2dedff20-2138-11ec-a8e0-f76ec38a4b1a-props.png" style="width: 100%;" class="fr-fic fr-dib">Go to Bucket Settings &gt; Webhooks to set props. <div class="fr-embedly " data-original-embed="<a href='https://gist.github.com/tonyspiro/526b5dcb61ecdd88599c2bed4d5b426e' class='embedly-card'></a>"><a href="https://gist.github.com/tonyspiro/526b5dcb61ecdd88599c2bed4d5b426e" class="embedly-card"></a></div>Wow, that&#39;s nice! Notice how much more concise the data payload is compared to not using props. Keep in mind that this currently only applies to first-level props (namespaced metadata declarations are not supported yet). We hope you enjoy this quick update to make your automated workflows with webhooks more efficient. If you have any questions, please join the conversation in the <a href="https://www.cosmicjs.com/community">Cosmic Slack channel</a> and reach out to us<a href="https://twitter.com/cosmicjs" rel="noopener noreferrer" target="_blank">&nbsp;on Twitter</a>.

Webhook Props Now Available

<img src="https://cdn.cosmicjs.com/9fa4abe0-e4a8-11eb-aaa7-f94d35ca882e-cosmic-usage.png" style="width: 100%;" class="fr-fic fr-dib">New usage graphs in the dashboard 📊 We are thrilled to tell you that Cosmic is growing faster than ever. As we serve an ever-increasing amount of content to billions of users globally we will continue to scale and provide you with the best content management experience in the world. To that end, we are implementing a new usage and overage policy, specifically the usage of our global CDN. <img src="https://cdn.cosmicjs.com/fb967680-e4a9-11eb-aaa7-f94d35ca882e-1626270428681.jpg" class="fr-fic fr-dii" style="width: 100%;">Our global CDN includes several points of presence located around the world to serve API and media resources blazing-fast within milliseconds. Along with our generous usage limits of non-cached API requests and media storage, we have added additional usage verticals of our global CDN which include:<ol><li>Cached API requests - Number of read requests after initial request per month</li><li>Media requests - Number of media requests per month</li><li>API bandwidth - Amount of API bandwidth served per month</li><li>Media bandwidth - Amount of media bandwidth served per month</li></ol> Pricing page updates Go to the <a href="https://www.cosmicjs.com/pricing">pricing page</a> to see the new overage policy and applicable costs for each usage plan. We have provided very generous limits on all plans and include a new table to inform you about the new overage costs. New usage graphs To track your Bucket usage, go to Bucket&nbsp;Settings &gt; Usage to see new usage graphs. Overage costs If you are one of the few customers that will have overage costs, you will be charged at the start of the month for the full overage usage of the previous month. The first overage invoices will go out at the start of August for July 2021 usage.To see any upcoming month-to-date overage invoices, go to Bucket / Group Plan Settings &gt; Billing&nbsp;(or Account Settings &gt; Billing Details if you added a plan since our <a href="https://www.cosmicjs.com/changelog/account-billing-updates">Billing update</a>).To avoid overage charges, you can always upgrade to the next usage plan level at any time. Reach out to <a href="mailto:sales@cosmicjs.com">sales@cosmicjs.com</a> if you need a custom quote. We are dedicated to providing you with the best content management experience in the world. And these updates are intended to help you track and scale your global content delivery as your business meets the demands of the growing digital economy.If you have any questions about this policy update, you can reach out to me directly in the <a href="https://cosmicslack.herokuapp.com/">Cosmic Slack channel</a> or <a href="mailto:tony@cosmicjs.com">by email</a>. Tony Spiro Cosmic CEO

Usage and Overage Policy Updates

We&#39;ve made some dashboard updates that should make managing account information, billing, and payment methods on your Cosmic account much easier. To get started, go to <a href="https://app.cosmicjs.com/account/billing-details">Account Settings &gt; Billing Details</a> to set up your payment methods and manage your global billing for your Cosmic products and services. New Payment Methods Manager You can now add and manage payment methods directly on your user account from your account settings area. Before, billing for Buckets was handled on the Bucket settings page. Now, with payment methods managed by your user account, you can manage billing for multiple Buckets and add-ons without re-entering payment information. Plus, you can now use Google Pay!Go to <a href="https://app.cosmicjs.com/account/billing-details" rel="noopener noreferrer" target="_blank">Account Settings &gt; Billing Details</a> to set up your payment methods. <video autoplay="" class="fr-draggable fr-fvc fr-dvi" loop="" muted="" playsinline="" src="https://cdn.cosmicjs.com/0a7aec70-bfc6-11eb-a51b-e5bc9c143c99-add-payment.mp4" style="width: 100%;">Your browser does not support HTML5 video.</video>Add Billing Details Along with this new way of managing your billing and payment methods, you can now update the name, email, and additional information that will be available on your invoices. Payment history will also be available on your account Billing Details page. (For the old Bucket billing, you will still see payment history on the Bucket billing page) <video autoplay="" class="fr-draggable fr-fvc fr-dvi" loop="" muted="" playsinline="" src="https://cdn.cosmicjs.com/ec484080-bfc6-11eb-a51b-e5bc9c143c99-billing-details.mp4" style="width: 100%;">Your browser does not support HTML5 video.</video>Group Plans for Bulk Rate Group plans (formally called Billing Packages) are available for grouping Bucket usage plans onto a single cost-savings bulk-rate plan. Choose between 5 and 10 Buckets, plus a 10% discount for yearly plans. Transfer Billing Transfering billing between members of your team is now easier than ever. To have another team member take over billing, simply have them click &quot;Transfer Billing&quot; and the billing will switch to their account. (Team members must have admin access on the Bucket
to transfer billing). See screenshot below.<img src="https://cdn.cosmicjs.com/71a567a0-bfc5-11eb-a51b-e5bc9c143c99-Screen-Shot-2021-05-28-at-9.57.25-AM.png" style="width: 100%;" class="fr-fic fr-dib">We hope you enjoy these updates to make it easier to manage your account and billing details. If you have any questions, you can reach out to us at <a href="//support@cosmicjs.com">support@cosmicjs.com</a>

Account Billing Updates

We have some exciting updates to share with you which includes:<ol><li>Documentation improvements: Client tabs, better nav, and more</li><li>New versions of the GraphQL, NPM, and CLI clients</li><li>New GraphQL API Postman collection</li><li>Ability to ignore the cache (handy for real-time updates)</li><li>Dashboard updates</li></ol>Read more about the updates below, or jump over to the updated docs to get started. <a href="https://docs.cosmicjs.com">Go to the docs &rarr;</a> <h2>Updates</h2>1. Documentation Our new documentation website just got a lot better. We&#39;ve added new tabs to show you the multiple methods for each resource including REST, Node.js, GraphQL, and the CLI.<video autoplay="" class="fr-draggable fr-fvc fr-dvi" loop="" muted="" playsinline="" src="https://cdn.cosmicjs.com/52a1ec40-7ddd-11eb-bca3-dfdf3200bafd-tabs.mp4" style="width: 100%;">Your browser does not support HTML5 video.</video> 2. New client versions We have new GraphQL API (v3), NPM (v4), and CLI (v2) versions available that parallel the new features in the REST API v2 and follow the same request and response formats. See the docs changelog for the updates. 3. Postman collection for GraphQL API Along with the REST API, we now have a <a href="https://docs.cosmicjs.com/api-reference/getting-started/introduction#install-and-configure" rel="noopener noreferrer" target="_blank">Postman collection for the GraphQL API</a>.<video autoplay="" class="fr-draggable fr-fvc fr-dvi" loop="" muted="" playsinline="" src="https://cdn.cosmicjs.com/c0118470-7ddd-11eb-bca3-dfdf3200bafd-postman.mp4" style="width: 100%;">Your browser does not support HTML5 video.</video>4. Ignore cache (real-time updates) You can now ignore the cache for your API requests by setting <code>use_cache=false</code> as a query parameter in your GET requests. Why would you want to ignore our globally-fast CDN? This is helpful if you are doing real-time updates. For example, if you make an update to Object and immediately want to return the updated Object (as the cache takes ~200ms to purge). 5. Dashboard quality of life improvements We&#39;ve updated the Bucket settings page to include links to each section. We think this is a more helpful way to organize your Bucket settings.<img src="https://cdn.cosmicjs.com/c1d629c0-7ddb-11eb-bca3-dfdf3200bafd-Screen-Shot-2021-03-05-at-11.53.36-AM.png" style="width: 100%;" class="fr-fic fr-dib"> We hope you enjoy these new updates. Head over to the new documentation site to check out all of these updates. And ping us in Slack if you have any questions.

Docs updates + GraphQL + NPM + CLI updates

We are excited to introduce Cosmic REST API v2 (alpha). The API has been rebuilt from the ground up to be lighter, faster, with lots of new features to make building Cosmic-powered apps even better.Along with this release, we&#39;ve built a <a href="https://docs-v2.cosmicjs.com" rel="noopener noreferrer" target="_blank">brand new documentation site</a> to help you learn more about all the new features. We recommend you start there to get all the latest and greatest in this release. Read below to get a breakdown of the new features, improvements, and changes. <video autoplay="" class="card-shadow fr-draggable lazy-load fr-fvc fr-dvi" data-video="https://cdn.cosmicjs.com/309d8980-6af3-11eb-afd3-010bb5d66a3e-Docs-v2.mp4" loop="" muted="" playsinline="" style="width: 100%;">Your browser does not support HTML5 video.</video><h3> New Features</h3><ul><li>Nested <code>metadata</code> props are now possible without limit. See <a href="https://docs-v2.cosmicjs.com/api-reference/objects#using-props" rel="noopener noreferrer" target="_blank">examples of nested props</a>.</li><li>No depth limit for Object relationships. The only limit is the prevention of infinite recursion.</li><li>We now offer a <a href="https://docs-v2.cosmicjs.com/api-reference/getting-started/introduction#postman" rel="noopener noreferrer" target="_blank">Postman collection</a> to review and demo all REST API methods.</li><li>You can now use the <code>after</code> param for Object pagination.</li><li>We now have endpoints for <code>Metafields</code> and <code>Media Folders</code> to do CRUD operations directly.</li></ul><h3>Improvements</h3><ul><li>Lighter codebase, faster endpoints. In some cases, endpoint response times are up to 50% faster (non-cached).</li><li>Better endpoint structures that follow standard REST conventions such as <code>POST /resources</code>, <code>GET /resources/:resource_id</code>, etc.</li><li>Consistent error responses with verbose messages.</li><li>The Select Dropdown Metafield now includes both <code>key</code> and <code>value</code> in the API response.</li></ul><h3>Changes</h3><ul><li><code>_id</code> has been changed to <code>id</code>.</li><li><code>type_slug</code> has been changed to <code>type</code>.</li><li><code>status</code> can now either be <code>published</code> or <code>any</code> (which returns latest Object version draft or published).</li><li><code>query</code> is now the primary method for fetching and filtering Objects (Advanced Queries from v1). See <a href="https://docs-v2.cosmicjs.com/api-reference/queries" rel="noopener noreferrer" target="_blank">Queries and Logic</a> for examples.</li><li>Single Objects must now be fetched using <code>id</code>. To fetch by <code>slug</code>, you will need to use <code>query</code>.</li><li><code>write_key</code> will now be required in the request header as <code>Authorization Bearer</code>.</li><li><code>metafields</code> are hidden by default.</li><li>Stricter user input requirements. No additional fields are possible in the body for <code>POST</code> and <code>PATCH</code> requests.</li><li>There is a new, more secure token authentication strategy.</li></ul><h3> </h3><h3>Next Steps</h3><a href="https://docs-v2.cosmicjs.com" rel="noopener noreferrer" target="_blank">Read the docs</a> to learn more about all the updates and improvements. We would appreciate your input as we get the REST API v2 ready for production. If you have any comments or questions, please drop them in the comments below or in <a href="https://cosmicslack.herokuapp.com/" rel="noopener noreferrer" target="_blank">our Slack channel</a>.- Cosmic Team

Start building today