microcms-js-sdk
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.0 • Public • Published

    microCMS JavaScript SDK

    It helps you to use microCMS from JavaScript and Node.js applications.

    Getting Started

    Install

    Install npm package.

    $ npm install microcms-js-sdk
    
    or
    
    $ yarn add microcms-js-sdk

    CDN support.

    <script src="https://unpkg.com/microcms-js-sdk@latest/dist/umd/microcms-js-sdk.js"></script>
    

    How to use

    First, create a client.

    const { createClient } = require("microcms-js-sdk"); // CommonJS
    import { createClient } from 'microcms-js-sdk'; //ES6
    
    // Initialize Client SDK.
    const client = createClient({
      serviceDomain: "YOUR_DOMAIN", // YOUR_DOMAIN is the XXXX part of XXXX.microcms.io
      apiKey: "YOUR_API_KEY",
    });

    When using with a browser.

    <script>
    const { createClient } = microcms;
    
    // Initialize Client SDK.
    const client = createClient({
      serviceDomain: "YOUR_DOMAIN", // YOUR_DOMAIN is the XXXX part of XXXX.microcms.io
      apiKey: "YOUR_API_KEY",
    });
    </script>

    After, How to use get it below.

    client
      .get({
        endpoint: 'endpoint',
        queries: { limit: 20, filters: 'createdAt[greater_than]2021' },
      })
      .then((res) => console.log(res))
      .catch((err) => console.log(err));
    
    client
      .get({
        endpoint: 'endpoint',
        contentId: 'contentId',
        queries: { fields: 'title,publishedAt' },
      })
      .then((res) => console.log(res))
      .catch((err) => console.log(err));

    And, Api corresponding to each content are also available. example.

    // Get list API data
    client
      .getList({
        endpoint: 'endpoint',
      })
      .then((res) => console.log(res))
      .catch((err) => console.log(err));
    
    // Get list API detail data
    client
      .getListDetail({
        endpoint: 'endpoint',
        contentId: 'contentId',
      })
      .then((res) => console.log(res))
      .catch((err) => console.log(err));
    
    // Get object API data
    client
      .getObject({
        endpoint: 'endpoint',
      })
      .then((res) => console.log(res))
      .catch((err) => console.log(err));

    TypeScript

    If you are using TypeScript, use getList, getListDetail, getObject. This internally contains a common type of content.

    // Type definition
    type Content = {
      text: string,
    }
    
    /**
     * // getList response type
     * {
     *  contents: Content; // This is Content type
     *  totalCount: number;
     *  limit: number;
     *  offset: number;
     * } 
     */
    client.getList<Content>({ //other })
    
    /**
     * // getListDetail response type
     * {
     *  id: string;
     *  createdAt: string;
     *  updatedAt: string;
     *  publishedAt: string;
     *  revisedAt: string;
     *  text: string; // This is Content type.
     * } 
     */
    client.getListDetail<Content>({ //other })
    
    /**
     * // getObject response type
     * {
     *  createdAt: string;
     *  updatedAt: string;
     *  publishedAt: string;
     *  revisedAt: string;
     *  text: string; // This is Content type.
     * } 
     */
    client.getObject<Content>({ //other })

    LICENSE

    Apache-2.0

    Install

    npm i microcms-js-sdk

    DownloadsWeekly Downloads

    3,164

    Version

    2.0.0

    License

    Apache-2.0

    Unpacked Size

    69.9 kB

    Total Files

    21

    Last publish

    Collaborators

    • himaratsu
    • shibe97
    • hiro08