# DruxtClient

The DruxtClient is the communication layer between Nuxt and the Drupal JSON:API.

It provides methods to get JSON:API Resources and Collection of resources from the Drupal server using the Axios (opens new window) library.

# Setup

The Client requires the baseUrl for your Drupal backend:

const { DruxtClient } = require('druxt')
const druxt = new DruxtClient('https://demo-api.druxtjs.org')

1
2

It also provides an options object to configure the client:

const druxt = new DruxtClient('https://demo-api.druxtjs.org', {
  axios: {
    headers: {'X-Custom-Header': true},
  },
  endpoint: 'jsonapi'
})

1
2
3
4
5
6

See the API documentation for more details.

# Getting a resource

The getResource method requires the resource type and id, and has an optional query parameter.

Get a page.

druxt.getResource('node--page', 'd8dfd355-7f2f-4fc3-a149-288e4e293bdd').then(resource => {
  // Do the thing.
})

1
2
3

Get a page's title.

druxt.getResource(
  'node--page',
  'd8dfd355-7f2f-4fc3-a149-288e4e293bdd',
  'fields[node--page]=title'
).then(resource => {
  // Do the thing.
})

1
2
3
4
5
6
7

# Getting a collection of resources

The getCollection method requires the resource type, and has an optional query parameter.

Get a collection of recipes.

druxt.getCollection('node--recipe').then(collection => {
  // Do the thing.
})

1
2
3

Get the first 5 recipes.

druxt.getCollection('node--recipe', 'page[limit]=5').then(collection => {
  // Do the thing.
})

1
2
3

# Getting all collections of a resource

The getCollectionAll takes the same parameters as the getCollection method, and will return an array of all collections.

Get all recipes.

druxt.getCollectionAll('node--recipe').then(collections => {
  for (i in collections) {
    const collection = collections[i]
    for (j in collection.data) {
      const resource = collection.data[j]
      // Do the thing.
    }
  }
})

1
2
3
4
5
6
7
8
9

← Getting started DruxtClient() →