Skip to content
+

Installation

Setup Toolpad to run on your own machine.

Create a Toolpad app

Start by opening a terminal and cd into a folder you'd like to create your application in. Then run the command:

npx create-toolpad-app@latest my-toolpad-app

This will run the create-toolpad-app CLI which initializes the directory ./my-toolpad-app with a Toolpad application.

Run the Toolpad editor

Change the current working directory to the application folder:

cd my-toolpad-app

Then start the development mode

npm run dev

This starts the development server on port 3000 or the first available port after that and opens the browser to the Toolpad editor.

Install Toolpad in an existing project

Start by installing the required dependencies:

pnpm install -S @mui/toolpad

Then you'll have to add the toolpad scripts to yur package.json:

// ./package.json
...
  "scripts": {
    "toolpad:dev": "toolpad dev ./my-toolpad-app",
    "toolpad:build": "toolpad build ./my-toolpad-app",
    "toolpad:start": "toolpad start ./my-toolpad-app"
  }
...

Now you can start your toolpad application using one of the commands:

npm run toolpad:dev

When you run this command, Toolpad will automatically initialize a new application in the ./my-toolpad-app folder.