Create Next.js project

Create a new Next.js project using the starter

Now that we have completed the Drupal configuration, we can create our Next.js project.

We are going to use the basic starter.

Install Node.js

Start by installing Node.js on your system, download it from https://nodejs.org/en/download/

We're always on the move upgrading everything from packages, dependencies to Node.js versions. We highly recommend installing Node.js using nvm. nvm allows you to quickly install and use different versions of node via the command line.

Create Project

Run the following command to create a new Next.js project:

git clone git@bitbucket.org:adminvoid/vactory_next.git

Install dependencies

Run the following command to install dependencies using yarn:

cd vactory_next
yarn install

Connect Drupal

To connect the Next.js project to Drupal, we use environment variables.

  1. Navigate ./apps/starter
  2. Copy .env.example to .env.
  3. Fill in the following Environment variables:

.env

NEXT_DRUPAL_BASE_URL=http://localhost:8080
NEXT_IMAGE_DOMAIN=localhost
NEXT_BASE_URL=http://localhost:3000

Start Development Server

To start the Next.js development server, run yarn workspace starter dev. This starts the development server on http://localhost:3000.

Visit http://localhost:3000 to view the site.

Need help?

We understand there's more than a few steps to properly configure Next.js for Drupal, so here is a video to help you get through these difficult times.

Enable ModulesCreate Content