hero

DruxtJS

A Bridge between frameworks, NuxtJS in the front, Drupal in the back.

Get started

Simplicity first

The Druxt component connects NuxtJS to your Drupal JSON:API.

Community built

Built by the community, for the community.

Decoupled Drupal sites

The Site module brings decoupled Vue.js theming system to Drupal.

DruxtJS provides an easy connection between a Drupal JSON:API backend and NuxtJS frontend application.

# DruxtClient

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

Example:

const { DruxtClient } = require('druxt')

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

druxt.getCollection('node--page').then((res) => {
  ...
})
1
2
3
4
5
6
7

Get started with the Guide and API Documentation.

# The Druxt component

Druxt provides a Vue.js component to easily access Drupal's JSON:API data, with a simple Slot based theming system.

<Druxt :module="module" :props-data="propsData" :wrapper="wrapper" />
1

Get started with the Guide and API Documentation.

# Join the community

DruxtJS is an open source project, built by the comunity for the community.

Find support or get involved in building Druxt via our community channels:

# Site Module / Drupal Umami Parity project

The DruxtJS Site module provides minimal configuration, decoupled Drupal site functionality.

Take a look at the Umami Parity project demo (opens new window), or checkout source for the NuxtJS frontend (opens new window) and the Drupal 9 backend (opens new window).

Drupal Umami Parity demo

Get involved at the Umami Parity project board (opens new window) or try out the DruxtJS Site (opens new window) module.