Skip to content
Arc XP

How To Run PageBuilder Engine Locally

After we have created and configured our Feature Pack repository, we are ready to run PageBuilder Engine locally so we can start developing components and seeing them on a webpage. This article provides general local development configuration and two different ways to get your local environment up and running. You may be starting from scratch and want to get started with a Hello World example, or if you are a new engineer in a team who already created their digital experience with Arc XP and currently running a bundle in production, you simply want to copy and get started with the latest codebase in your local environment.

General local development configuration

This section lists the general configurations you need to start developing locally.

Node.js development environment

PageBuilder Engine requires the following node and npm versions to run in your local development environment:

  • Engine 2.x (Deprecated)

    • Node 12.x

    • NPM 6.x

  • Engine 3.x - Themes 1.29 compatible

    • Node 14.x

    • NPM 6.x or 7.x

  • Engine 4.x - Themes 1.30, 1.31 and 2.1 compatible

    • Node 16.x

    • NPM 7.x or 8.x

  • Engine 5.x

    • Node 18.x

    • NPM 7.x or 8.x

To work with different node and npm versions easily, we suggest a version manager like nvm.

Docker

The PageBuilder Engine and services that support it run in Docker containers that can be spun up for local development. To do so, you’ll need to download and install Docker if you haven’t already. Once you’ve installed Docker, you’ll need to start it and allocate at least 8GB of RAM and 6 CPUs to it so it has the resources necessary to run all the services PageBuilder Engine requires.

Installing and using fusion-cli

The commands we will refer moving forward that starts with npx fusion assumes that your project have Arc XP’s fusion-cli package to be installed. The boilerplate project structure and the package.json file in it contains the fusion CLI in it. But in case it’s not included you can install @arc-fusion/cli as dev dependency with running npm install --dev @arc-fusion/cli command. Now you should be able to run npx fusion [cmd] commands in your project folder.

Starting PageBuilder Engine

To start the PageBuilder Engine with the Feature Pack you’ve created, on the command line, run the following command from the root of your Feature Pack repository:

Terminal window
npx fusion start

This starts the PageBuilder Engine, as well as a PageBuilder Editor instance. It may take a while for this command to run the first time, as Docker needs to download copies of all the correct images before containerizing and starting them. In the future, this step will be much quicker as Docker will already have these images downloaded.

Accessing PageBuilder Editor

You should see log messages showing up in your command line console - once they stop updating, try visiting http://localhost/pagebuilder/pages to see the PageBuilder Editor. If you previously dropped a tar.gz file into the /Data/Restore directory of your feature pack (see How to configure a component bundle), you should see the data from that database reflected in PageBuilder Editor (for example, any pages, templates or resolvers in the DB should show up in the PageBuilder Editor). For now though, we’ll assume you’re starting your database from scratch without data.

Even though the PageBuilder Engine is running, it’s not doing much right now because we don’t have any components for it to render. As we create components, PageBuilder Engine will watch our feature pack and let the PageBuilder Editor know about changes to features, chains, and layouts in our Feature Pack.

Stopping the server

For now, we’re going to keep running our server so we can develop locally with it - but anytime you want to stop running PageBuilder Engine, you can run:

Terminal window
npx fusion down

in your command line (you may also be able to simply CTRL+C in the same Terminal window as your initial npx fusion start command). To check if all the PageBuilder Engine services have stopped running, run:

Terminal window
docker ps

which will tell you a list of all running Docker services - if any entries show up, it means you’re still running something on Docker.

Additional considerations for Local Development

Running PageBuilder Engine locally is somewhat different than running it in production. You can control the behavior of your local PageBuilder Engine instance by setting some important environment variables. See Environment Variables for details on these options.

1. Starting from scratch “Hello World” example

  • Play

    • Go to Starting from scratch with Hello World example to see step by step guide for our Hello World video tutorial content.

    2. Starting with my organization’s live bundle and PageBuilder data (pages)

  •

    • Read to Starting with my organization's live bundle and pages to see step by step guide of this video tutorial.

    Frequently Asked Questions

    Learn more about CLI

    Check out the list of Helpful Commands or look in the package.json file in the root of your repository for the definitions of the commands themselves.

    Problems Running PageBuilder Engine In My Local Environment Following a PageBuilder Release

    Check out Problems Running PageBuilder Engine In My Local Environment Following a PageBuilder Release