Parse Dashboard

This guide will teach you how to set up your own Parse Dashboard.

This guide will teach you how to set up your own Parse Dashboard.

The data stored in your MongoDB will be automatically synced and shown here:

With MongoDB and Parse Dashboard set up, you'll have an almost exact experience to the Moralis-hosted-server's database:

Installation

npm install parse-dashboard

Configuration

Inside your src folder create a new file named parseDashboard.ts. Fill it with the following code:

//@ts-nocheck
import ParseDashboard from "parse-dashboard";
import config from "./config";

export const parseDashboard = new ParseDashboard(
  {
    apps: [
      {
        appName: "Moralis Server",
        serverURL: config.SERVER_URL,
        appId: config.APPLICATION_ID,
        masterKey: config.MASTER_KEY,
      },
    ],
  },
  { allowInsecureHTTP: true }
);

Now inside index.ts, import the file you just created:

// @ts-ignore
import ParseServer from "parse-server";
import Moralis from "moralis";
import config from "./config";
import cors from "cors";
import express from "express";
import http from "http";
import ngrok from "ngrok";
import { parseServer } from "./parseServer";
import { streamsSync } from "@moralisweb3/parse-server";

// Import parseDashboard.ts //
import { parseDashboard } from "./parseDashboard";

//.....

Then create a new route to access your dashboard:

//......

app.use(
  streamsSync(parseServer, {
    apiKey: config.MORALIS_API_KEY,
    webhookUrl: "/streams",
  })
);
app.use(`/server`, parseServer.app);

// Add the new route //
app.use(`/dashboard`, parseDashboard);

//......

Build and run

Build the project:

npm run build

And then run it locally:

npm run start

Accessing

Head over to http://localhost:1337/dashboard/ to access your self-hosted dashboard:

Securing access

You can protect your dashboard from being accessed by the public by adding usernameand password.

Replace all the code in parseDashboard.ts for the following:

//@ts-nocheck
import ParseDashboard from "parse-dashboard";
import config from "./config";

export const parseDashboard = new ParseDashboard(
  {
    apps: [
      {
        appName: "Moralis Server",
        serverURL: config.SERVER_URL,
        appId: config.APPLICATION_ID,
        masterKey: config.MASTER_KEY,
      },
    ],
    users: [
      {
        user: "username123",
        pass: "password123",
      },
    ],
  },
  { allowInsecureHTTP: true }
);

Where user will be your username and pass will be your chosen password.

To test this you have to rebuild and restart your local server:

npm run build

npm run start

username and password will now be required when accessing http://localhost:1337/dashboard/.