Configure your Project


These docs rely on Slice Machine, which is in active development and subject to change. Content Relationships are not currently supported with Slices.

Package versions

These docs use the following package versions:

  • prismic-reactjs: v1.3
  • @prismicio/client: v5

The docs will soon be updated to use the latest versions of these packages. If you wish to use the latest versions today, you can update your project by following the migration guides for each package.

We'll be getting everything we need for this tutorial series setup and prepared. This includes downloading the initial project files, launching a Prismic repository, and installing the required dependencies.

Before you start - Node Version

For this project to work correctly, you will need to have at least version 16 of node installed on your machine. You can check this by running the node -v command in your terminal.

1. Install Node

Node.js is used to power most modern Javascript frameworks to help you build websites fast and easily. Using Node.js, you can work with Javascript outside the browser. NPM (Node Package Manager) is used to install the various node dependencies used to power the Slice Machine. Luckily this installation process is something that is very well documented already.

So we'll allow William Vincent and his slick tutorials to take you through the process.

2. Install the Prismic CLI

So now we'll install the Prismic CLI (command line interface), if you haven't already. This tool will allow you to interact with Prismic from your local machine for things like creating repositories. To install it globally run the following command.

  • npm
  • Yarn
npm install -g prismic-cli
yarn global add prismic-cli

Sometimes it's possible that a global (-g) command like this doesn't work because of permission levels on your machine.

If that's the case for you, try executing the sudo command below:

  • npm
  • Yarn
sudo npm install -g prismic-cli
sudo yarn global add prismic-cli

CLI Version

You will need to make sure you're using the latest version of the CLI, which you can check on npm. (Check your version by running prismic --version).

3. Sign in to Prismic with the CLI

If You Don't Have a Prismic Account

After installing the CLI you should be able to create a Prismic account by running the following command:

prismic signup

If You Already Have a Prismic Account

After making sure that you have the correct version of the CLI, you can log in to Prismic by running the following command.

prismic login

4. Install The Next.js/Prismic Boilerplate Project

The following command will download and automatically configure a project with tools to start your Prismic development journey.

prismic theme --theme-url --conf sm.json

What Does This Command Do?

This command does a lot of different things for you, including downloading a boilerplate project to get you up and running with all the necessary libraries to fetch and display Prismic data like @prismicio/clientnext-slicezone, and next.

It also creates a Prismic repository with a standard "Page" custom type. You should receive a confirmation email, and you can see your new repo by the following link from the email you received or by going directly to Prismic.

Next and Previous articles

Was this article helpful?
Not really
Yes, Thanks

Can't find what you're looking for? Get in touch with us on our Community Forum.