Deploy Express App to Render with MySQL

Now that Heroku isn't free anymore, we are all looking for new places to host our apps. Today we'll look at Render to host a Node/Express application with a Handlebars frontend and a MySQL database.

With Heroku, we could provision our databases directly on the website while creating our app. Perhaps some of you used JawsDB, as I did many times. Provisioning it was as simple as clicking the button for a free add-on. Render does not have such an option for MySQL databases. However, we can bring our own database with only slightly more effort than with Heroku/Jaws.

Today I am using a 5MB (same as Jaws) free database provided by https://www.freemysqlhosting.net/.
After signing up and verifying my email I was able to request the MySQL database and have credentials emailed to me within seconds. You will need the host name (not in the email, but right there on the website), sql3.freemysqlhosting.net, the DB name, DB password, and DB username for Render. If you don't want to use freemysqlhosting.net, please feel free to create a database anywhere you like. Every site that allows you to host a DB will give you the requisite information to plug in to Render.

Within the app's code, we are using Sequelize as the ORM for working with our SQL database. We have a connection.js file that holds our code to connect our app to our database. It looks like this:

const Sequelize = require('sequelize');
require('dotenv').config();

let sequelize;

sequelize = new Sequelize(
  process.env.DB_NAME,
  process.env.DB_USER,
  process.env.DB_PASSWORD,

  {
    host: process.env.DB_HOST,
    dialect: 'mysql',
    port: 3306
  }
);


module.exports = sequelize;

There is a local .env that has the variable values, but we don't need that for our deploy. We have to enter the values of these environment (env) variables directly in Render. We'll get to that momentarily.

After you create or update this connection code, be sure to push to GitHub. We are going to use the Render direct connection to GitHub to make things easier.

On the Render website dashboard, https://dashboard.render.com/, click "NEW" and create a new web service. Then choose to deploy from a Git repository. Connect the repository you want to deploy and fill in some basic information, such as a name for the project, the branch you wish to use, the runtime, build command, and start command. These should be filled in for you already, and I all I like to change is the start command, because I use "npm start".

Make sure you click the Free option, and under the payment options you will see a place to enter Environment Variables.

Fill them out so that they match your connection.js above. Here is the example that matches my connection code above:

(you can disregard the SESS_SEC if you are not using session secrets, that is not a part of our tutorial today)

Once you have the DB env variables filled out with the actual values given to you in the email from the freemysqlhosting.net, you are ready to create the web service, so hit the create button at the bottom of the page.

You will be shown the logs of your build/deploy. You will have to solve any issues that come up, of course, but that is outside the scope of this tutorial. If everything works with the database, you will see the SQL that creates the tables on the log just as you do in your node terminal when you start your app on localhost.

The address for your new deployed app is at the top left of the page, and you should now follow that address and make sure your app is fully functioning.

Hopefully you have enjoyed this easy way to BYODB to Render and deploy a new web service.