Developer Dashboard

The Developer Dashboard is a web GUI that allows you to create and manage local projects. This includes starting and stopping projects, checking project logs, and debugging.

Starting the Developer Dashboard

On Mac and Linux, go to the command line. Run the following command in your working directory:

sudo moov start

Using Windows?

On Windows, a shortcut icon will have been placed on your Desktop when you installed the SDK. Right-click on the icon and select “Run as administrator” to start.

Right-click and select "Run as administrator"

Running moov start creates a new directory named Moovweb Projects and opens the Developer Dashboard in your preferred browser (at http://127.0.0.1:4002).

The first time you launch the Developer Dashboard, it will not have any projects in it. To generate a new project, click the “Generate New Project” button to bring up the Project Generator. (You can also import any previously deployed projects you may have downloaded from the Control Center by clicking “Load Existing Project .zip”.)

The Developer Dashboard

To start a particular project, just hit the play icon button in the Start/Stop column, and when the project is ready it will switch to a stop button to indicate that it is running. Click the project name to see your development copy of the website running in a local browser window. Note that only one project can be running at a time.

Dashboard with upload project menu

To stop the project, just hit the “Stop” button.

If a project has layers, you can access these from the dropdown menu:

Dashboard with upload project menu

When a project is running you will see three buttons on the right: Logs, Debugger, and Replay Mode. These controls provide a variety of powerful tools for your currently running project.

Dashboard with upload project menu

Logs

The logging panel improves Moovweb terminal messages by adding syntax highlighting and filtering capabilities.

Moovweb Toolkit Logger

This allows you to quickly see what files are being imported, relevant error messages, and generally useful log messages.

You can also view color-coded differences between request and response headers to see exactly how your upstream and downstream headers are being modified by Moovweb.

Moovweb Toolkit Headers

Debugger

The debugger panel allows you to set breakpoints in your Tritium code, examine variables, and inspect the HTML document at any point in the transformation process.

Moovweb Toolkit Debugger

Next time your code doesn’t work as expected, just open this tab and pinpoint the problem.

Hit the “Current Doc” button to see exactly where your document is in the transformation.

Replay Mode

Replay Mode allows you to replay a previous response without going back upstream.

For example, if you submit a form and you just want to see the exact same HTML response but you don’t want to have to fill out the form again or go through the flow to get there, you can use Replay Mode.

Once you have enabled it, any new link you visit (or any time you refresh the current page), a cached copy of the response will be delivered (if available). In the logs, you will see a message telling you a previous response is being used.

Moovweb Toolkit playing previous response