Screenshot of one of my databases

Setting Up a Mobile Backend Server in an Hour

Syed Muzani

--

There are a lot of ways to set up a backend server. The learning curve can be quite high, and may take a couple weeks before you can even set up even a simple REST server.

If you’re just a web or app developer, you just want something up so you can start building things. I highly recommend Parse Server.

What’s the plan?

We will be setting up Parse Server (the server) and Parse Dashboard (the thing to view servers).

We host this on Heroku. We will need a MongoDB database, and will get it from mongoDB.com.

You will need

Why Parse Server?

Parse Server is very powerful, and yet easier to work with than something like Firebase. It has a lot of the upsides of a MEAN stack, and yet few downsides.

Why isn’t everyone using it? I’m not sure either.

Parse Server seems to have a bit of a stigma. It was once owned by Facebook as Parse.com. They stopped supporting the business and open sourced it as Parse Server. It’s an abandoned child, but what many people don’t realize is that it’s more powerful in Parse Server form than it was as Parse.com.

While Parse uses MongoDB as its base, it also has the neatness of a relational database. It supports complex things like many-to-many operations quite easily, which I feel is one of the bigger advantages over Firebase.

There are some nice features built in as well: Authentication, roles, e-mail verification, easy to connect with Facebook login, upload of files, caching, GeoPoints. It’s very easy to set up in apps & web, skipping the need for an API, though it has an API if you want one.

It’s just more powerful than building your own server from scratch, and has plenty of features over PaaS competitors like Firebase.

Setting up Parse Server on Heroku

Documentation for Parse Server is here. We’ll do a more advanced setting, one that gives us the most flexibility in the future. This would allow us to change things like file servers and email adapters later, set up https, as well as update it to the latest version easily.

The first thing we do is set up a MongoDB database. Head over to mongodb.com.

Sign up for an account, select MongoDB Atlas, create a new project, then create a new cluster. MongoDB Atlas gives you one free cluster per project.

Pick any cloud provider and region.

It’ll take a few minutes, then you should have set up a basic cluster. Click the Connect button on the cluster. Then set up a database user. For now, allow IP access from anywhere, until you have your Heroku account set up. Make sure to remember these credentials. Then click “Choose a connection method”.

You insert the username and password you just put in. In my case, my database URI is something like

mongodb+srv://muzani:<password>@cluster0.ab01cd.mongodb.net/cluster0?retryWrites=true&w=majority

Yours will be what shows in that page, but replace it with your username and password, and take note of the cluster name. We’ll be using this shortly. In this example, our cluster name is cluster0 but take note of yours.

Set up your Parse Server

Open up cmder or whichever terminal you’re using. Make sure you have both npm and Node.js installed. You can test it by typing the following commands into your terminal:

node -vnpm -v

If they’re installed, they should show the version numbers.

Create a directory for your server. Inside the directory, type

npm init

Answer all the given questions. You can simply press enter on all the answers.

You need to modify package.json to add “start”: “node index.js”. This is for when we upload to server later, it tells the server what to run when it wants to host. It would look something like this after modification.

{
"name": "parseserver",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js"
},
"author": "",
"license": "ISC",
}

Install parse-server and Express into the app:

npm install parse-server --savenpm install express --save

Create a file called index.js and put the following in:

var express = require('express');
var ParseServer = require('parse-server').ParseServer;
var app = express();
var api = new ParseServer({
databaseURI: 'mongodb+srv://muzani:whateverpassword@cluster0.ab01cd.mongodb.net/cluster0?retryWrites=true&w=majority', // Connection string for your MongoDB database
appId: 'svxxUHuBufkcM4nhHVuTuq2t', // change this
masterKey: 'VLEZtmMaxYfn7PUh9cmj9Pzu', // Change this and keep this key secret!
serverURL: 'http://localhost:1337/parse' // Don't forget to change to https if needed
});
// Serve the Parse API on the /parse URL prefix
app.use('/parse', api);
var port = process.env.PORT || 1337;
app.listen(port, function() {
console.log('Parse Server running on port ' + port);
});

Replace the URI with the MongoDB URI you created earlier. Replace appId and masterKey with some other string.

Now let’s test the server. Run the following:

node index.js

If it runs successfully, it should say

parse-server-example running on port 1337.

Go to http://localhost:1337/parse. You should get

{“error”:”unauthorized”}

That means your server is set up right.

If you have curl, you can run the following to test it. Replace APPLICATION_ID with your own appId. If you don’t have curl, don’t worry too much about it; this section isn’t necessary.

curl -X POST -H "X-Parse-Application-Id: APPLICATION_ID" -H "Content-Type: application/json" -d '{"score":1337,"playerName":"Sean Plott","cheatMode":false}' http://localhost:1337/parse/classes/GameScore

You should get a response similar to the following. This tells you that your database is successfully hosted.

{"objectId":"tGEApdbPX0","createdAt":"2017-12-14T08:57:59.403Z"}

On your MongoDB Atlas, go to Cluster -> Collections:

This means that our database is successfully set up!

Deploying your Parse Server to Heroku

However, our database is still offline. We have to host it somewhere. I suggest using Heroku, because it’s quite easy to set up and maintain. You can also use any cloud server that supports Node.js.

Cancel your server if it is still running (CTRL+C).

Create a file called Procfile in your directory, without extensions. Enter the following into your Procfile and save.

web: node index.js

Procfiles are used to tell Heroku what to run when it hosts.

Make sure that you have registered a Heroku account and Heroku CLI is installed. The following should return your Heroku CLI version:

heroku -v

Login to your Heroku account from the CLI. Enter your username and password for Heroku.

heroku login

Create a file called .gitignore and add the following line:

/node_modules

Set up Git for the app.

git initgit add .git commit -m "Initial commit"

Set up a heroku account, but replace myparseserver-example with a unique name of your own.

heroku create myparseserver-example

Finally, we deploy it:

git push heroku main

For a quick test, go to http://(yourservername).herokuapp.com/parse You should get the following error:

{"error":"unauthorized"}

Installing Parse Dashboard

Great, we have our server up and ready. It now fully supports your back end and you can make things with it.

But let’s add one more thing. Parse Dashboard gives you the power to do CRUD things with your database quickly and easily.

You have the flexibility to use Parse Dashboard in many ways. If you want to have full control and security, you can host it from your own PC. Or you can choose to use the same dashboard for multiple Parse Server apps, and control different access levels for a team.

But for this tutorial, we’ll take the more complex option, which is to host both Parse Server and the Dashboard on the same app.

Let’s add Parse Dashboard to our dependencies.

npm install parse-dashboard --save

Open up your index.js file again and modify to add the Parse Dashboard to it. It should look similar to the following, but replace XXXXX with your own values.

Take note: The masterKey and appId have to be the same for both the ParseServer and Dashboard.

var express = require('express');
var ParseServer = require('parse-server').ParseServer;
var ParseDashboard = require('parse-dashboard');
var app = express();

var api = new ParseServer({
databaseURI: 'mongodb://XXXXX',
appId: 'XXXXX',
masterKey: 'XXXXX', // Keep this key secret!
serverURL: 'https://XXXXX.herokuapp.com/parse'
});
var options = { allowInsecureHTTP: true };
var dashboard = new ParseDashboard({
"apps": [{
"serverURL": "https://XXXXX.herokuapp.com/parse",
"appId": "XXXXX",
"masterKey": "XXXXX",
"appName": "XXXXX"
}], "users": [{
"user":"XXXXX",
"pass":"XXXXX"
}]}, options);

// make the Parse Server available at /parse
app.use('/parse', api);

// make the Parse Dashboard available at /
app.use('/', dashboard);

var port = process.env.PORT || 1337;
app.listen(port, function() {
console.log('Parse Server running on port 1337.');
});

Then we commit and deploy it to Heroku.

git add .git commit -m "Parse Dashboard"git push heroku main

Go to http://(yourservername).herokuapp.com . You should be at a login page. Enter the username and password you set up in the “users” column.

You should reach a dashboard page. Click on your app, which should look something like this.

If you have successfully set up your dashboard, you should see the tables. Click GameScore to the left (if you’ve done the test above) and you should see one entry here. Feel free to add your own custom entries.

What next?

Your back end server should be fully set up.

Now look up the guides to set up the front end on whatever you’re building whether it’s JavaScript, PHP, Android, iOS, or many other tools.

--

--

Syed Muzani

Developer, have worked in tech and startups for many years.