MERN

The MERN stack consists of open-source software to get the backend and frontend up and running. Available as a one-click install, get MongoDB, ExpressJS, React and NodeJS installed on your Droplet in less than a minute.

Software Included

Creating an App using the Control Panel

Click the Deploy to DigitalOcean button to create a Droplet based on this 1-Click App. If you aren’t logged in, this link will prompt you to log in with your DigitalOcean account.

Creating an App using the API

In addition to creating a Droplet from the MERN 1-Click App using the control panel, you can also use the DigitalOcean API. As an example, to create a 4GB MERN Droplet in the SFO2 region, you can use the following curl command. You need to either save your API access token) to an environment variable or substitute it in the command below.

curl -X POST -H 'Content-Type: application/json' \
         -H 'Authorization: Bearer '$TOKEN'' -d \
        '{"name":"choose_a_name","region":"sfo2","size":"s-2vcpu-4gb","image": "mern"}' \
        "https://api.digitalocean.com/v2/droplets"

Getting Started After Deploying MERN

After your droplet is created, you can access your MERN stack by typing the droplet’s IP address in your browser:

If you see the Site can’t be reached or Nginx 502 Bad Gateway errors, give it 2-3 minutes and reload the page.

To connect to the local MongoDB console, use:

$ mongosh 127.0.0.1:27017 -u "admin" -p "<Your MongoDB password>" --authenticationDatabase "admin"

To connect your backend to the local MongoDB, use this connection string:

mongodb://admin:<Your MongoDB password>@127.0.0.1:27017

Your MongoDB password can be found on the welcome message of your MERN terminal.

Sample React application is served by PM2 as a mern user. To view deployed applications, use:

$ su - mern -c "pm2 list"

After you have created your MERN droplet, it is highly recommended you configure an Nginx server block file for each site you plan to host. Doing so will make the default configuration the fallback, as intended, and will make it easier to manage changes when hosting multiple sites.

Configuring Nginx

To do so, you’ll need to create two things for each domain: a new directory in /var/www for that domain’s content, and a new server block file in /etc/nginx/sites-available for that domain’s configuration. For a detailed walkthrough, you can follow How to Set Up Nginx Server Blocks.

Adding a domain name

A domain name allows others to access your website with an encrypted connection. If you intend to host a website on your MERN Droplet 1-Click.

MERN Droplet 1-Click comes with certbot installed, making it easier to enable HTTPS on your 1-Click.

First, ensure your domain points to the new droplet IP. If your DNS is managed by DigitalOcean, it should look like this:

The DNS Host may be the same company you registered the domain with or another entity you designate. To connect your DNS hosting to DigitalOcean, check out this guide.

Once your A record is set up, you should configure nginx to host your new domain properly. Detailed instructions can be found in this article.

After you answer questions from certbot, your HTTPS setup is finished.

Use your domain in the web browser to access your MERN Droplet.

Droplet Summary

• UFW firewall allows only SSH (port 22, rate limited), HTTP (port 80), and HTTPS (port 443) access.
• The MERN Droplet comes with the mern user for managing sample applications and PM2.
• The MongoDB is set with the admin user and SCRAM-SHA-1 authentication.
• The MongoDB password for the admin user is located in /root/.digitalocean_password.
• Sample React application is located at /home/mern/client.