Getting started

Alinea can be integrated in existing or new projects.

If you're starting from scratch you can either:

• Use a framework to get started (for example Next.js)

• Start from one of our examples

• Start blank with a new directory
  mkdir alinea-example

In the rest of the guide we assume you run the commands from the directory of your project.

cd alinea-example

Install dependencies

Let's install the alinea package from NPM:

npm install alinea

The Alinea dashboard uses React to render, but it is marked as peer dependency — which means it is not installed by default. If React is not already included in your project you can install it now.

npm install react react-dom

Initialize the project

With the following command we'll create the necessary config file.

npx alinea init

Accessing the dashboard

The following command starts a local server on http://localhost:4500

npx alinea serve

If you're using a framework with its own development server it's possible to prepend the serve command to it. This will wait until the Alinea package is generated before starting the dev server. This makes sure userland code can always depend on the package being available. It also simplifies running the dashboard and development server without requiring tools like npm-run-all.

{
  "scripts": {
    "dev": "alinea serve -- next dev",
    "build": "alinea generate -- next build"
  }
}

Running publicly

To serve the dashboard publicly we'll need to add a backend with authentication. This is outlined in the deploy chapter.