Skip to content

Instantly share code, notes, and snippets.

@macmladen
Last active June 27, 2024 10:32
Show Gist options
  • Save macmladen/1d10aff27e8449d4e68c82fba1a159f5 to your computer and use it in GitHub Desktop.
Save macmladen/1d10aff27e8449d4e68c82fba1a159f5 to your computer and use it in GitHub Desktop.
#!/usr/bin/env bash
##
# Commands to get Next.js working with Drupal
#
# Author:
# - Mladen Djuric @MacMladen
#
# Requirements:
# - having DDEV installed https://ddev.readthedocs.io/en/stable/users/install/ddev-installation/
#
# Documentation:
# - https://next-drupal.org/learn/quick-start
#
# Sample project:
# - https://github.com/macmladen/next-drupal-workshop
#
# Issues, questions:
# - Use GitHiub issues https://github.com/macmladen/next-drupal-workshop/issues
## Project part
# Create and switch to directory
# This will be the name of the Drupal project
mkdir next-drupal
cd next-drupal
# Init DDEV
ddev config --project-type=drupal --docroot=web
ddev start
## Drupal part
# Get Drupal, drush
ddev composer create drupal/recommended-project
ddev composer require drush/drush drupal/admin_toolbar
# Install the site and login
ddev drush site:install \
-y \
--account-name=admin \
--account-pass=admin \
--account-mail=next@example.com \
--site-mail=next@example.com \
--site-name=DrupalNext
# Just launch the site
ddev launch
# Login drush way
ddev launch $(ddev drush uli)
# Add admin_menu
ddev drush en -y admin_toolbar admin_toolbar_tools admin_toolbar_search admin_toolbar_links_access_filter
# Add Chapter Three DrupalNext module
ddev composer require drupal/next
# Enable modules
ddev drush en -y next next_jsonapi
# To be sure everything is just fine
ddev drush cron
## Next.js part
# Create Next.js project in the 'next' directory
npx create-next-app -e https://github.com/chapter-three/next-drupal-basic-starter next
# We need to create .env from the .env.example
cp .env.example .env
# Change URL and domain to next-drupal.ddev.sites
# NEXT_PUBLIC_DRUPAL_BASE_URL=https://next-drupal.ddev.sites
# NEXT_IMAGE_DOMAIN=next-drupal.ddev.sites
nano .env
# Run the Next part. Changes are automatically reflected but for configuration changes, it requires restart.
npm run dev
# You can also choose to run it in the container baut then the port must be exposed by ddev
# You can create another container which runs the nextjs but it needs special configuration
npm run dev
# Now you need to create content which will reflect in Next.js webiste
#
# Caution:
# - you need to have 'URL alias' otherwise pages will not show and will break/throw error.
@cooldrupal
Copy link

cooldrupal commented Mar 17, 2024

This is a brilliant script. I also like admin_toolbar module.
In my mind,, usually, the drush should be installed to the dev environment by "composer require --dev drush/drush"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment