Comfortable Nuxt.js Module

Nuxt.js Module for Comfortable Headless CMS

Installation with yarn

yarn add comfortable-nuxt

Installation with npm

npm install comfortable-nuxt

Setup

In nuxt.config.js:

module.exports = {
  modules: [
    'comfortable-nuxt',
  ],

  comfortable: {
    apiKey: 'YOUR_TOKEN'
    repositoryApiId: 'YOUR_REPO_ID'
    // options: {
    //    useProxy: true,
    //    proxy: 'https://your-proxy.com/v1'
    // }
  }
}
  ...
}

Usage

The comfortable-nuxt module is a wrapper for the comfortable-javasctipt SDK.
The documentation with methods and examples for the JavaScript SDK can be found here: https://docs.comfortable.io/sdk/javascript

The nuxt module initializes the SDK automatically and exposes API methods as $cmft as a Promise.
SDK Methods like filters and sorting are exposed as $Comfortable.

Examples

For the following examples we'll use the await operator and fetch content for a page, but you can use $cmft like a regular promise with any component.

Fetching documents for a page

  export default {
    async asyncData(context) {
      const options = {
        embedAssets: true
      };
      const documents = await context.$cmft.getDocuments(options);

      return {
        documents: documents.data,
      }
    }
  }

  /**
   * With filters:
   */
   
   export default {
    async asyncData(context) {
      const options = {
        embedAssets: true,
        filters: new context.$Comfortable.Filter()
        .addAnd('slug', 'equal', context.params.slug)
      };
      const documents = await context.$cmft.getDocuments(options);

      return {
        documents: documents.data,
      }
    }
  }

Fetching a collection

  export default {
    async asyncData(context) {
      const options = {
        embedAssets: true
      };
      const documents = await context.$cmft.getCollection('flyingCars', options);

      return {
        documents: documents.data,
      }
    }
  }

Fetching a single document

  export default {
    async asyncData(context) {
      const options = {
        embedAssets: true
      };
      const document = await context.$cmft.getDocument('DOCUMENT_ID', options);

      return {
        document: document.data,
      }
    }
  }

Fetching a document with alias

  export default {
    async asyncData(context) {
      const options = {
        embedAssets: true
      };
      const page = await context.$cmft.getAlias('deLorean', options);

      return {
        page: page.data,
      }
    }
  }

More information

• Comfortable CMS Documentation
• Javascript SDK Documentation
• JavaScript SDK Changelog

Contributing

Pull requests are always welcome!

License

This repository is published under the MIT license.