One click, Fully Decoupled Drupal Site starter-kit with Druxt.
DruxtSite connects Drupal to Nuxt via JSON:API to provide a framework for building a Fully Decoupled site.
This repostory provides a quickstart installation of:
- Drupal 9
- Nuxt 2
- DruxtSite
- DruxtAuth
Try it before you fork it:
-
Click the Use this template button in GitHub and follow the on-screen instructions to Create a new repository.
-
Once the repository has been generated, open it in Gitpod by appending
https://gitpod.io#to the GitHub url.Example:
https://gitpod.io#github.com/druxt/quickstart-druxt-siteNote: If this is your first time using Gitpod, you can signup for a free plan with your Github account.
-
Wait for your codebase to build.
Note: To speed up this step, enable Prebuilds by follow the instructions @ https://www.gitpod.io/docs/prebuilds#enable-prebuilt-workspaces
Your environment contains a pre-install, pre-configured and running instance of Drupal and Nuxt, with the DruxtSite module enabled.
You can access the services in your browser, via the Remote Explorer extension, or via the URL pattern: https://[PORT]-[GITPOD_ID].[GITPOD_SERVER].gitpod.io
| Port | Service |
|---|---|
3000 |
Nuxt.js |
3003 |
Storybook |
8080 |
Drupal |
DDEV is an open source tool that makes it dead simple to get local PHP development environments up and running within minutes.
DDEV is used to manage the Drupal instance, and provides a CLI that can be used to run common drupal tasks, including ddev drush.
These commands should be run from within the /drupal folder.
Refer to the documentation for more details: https://ddev.readthedocs.io
It's a free, open source, cross-platform, local development environment and DevOps tool built on Docker container technology and developed by Tandem.
Lando will manage your Drupal workflow. All commands should be executed within the /drupal folder. For additional information on Lando: https://docs.lando.dev/getting-started/
To use Lando
cd ./drupallando startdrush si --db-url="mysql//drupal9:drupal9@database:3306/drupal9" minimal && drush en druxt -y- Visit http://druxt-quickstart.lndo.site/ in your browser
Zero-boilerplate authentication support for Nuxt.js!
The @nuxtjs/auth-next module is installed and configured to connect to the Drupal Simple OAuth module by way of the DruxtAuth module:
this.$auth.loginWith('drupal-authorization_code')- More details on how to use the
$authservice can be found at https://auth.nuxtjs.org/api/auth
Storybook integration with NuxtJS .
Druxt integrates with the Nuxt Storybook module to provide zero-configuration, auto-discovery stories with access to live data from your Drupal backend.
To start Storybook, navigate to the nuxt directory and run npx nuxt storybook.