Tips for Successful Heroku Deployments
Darian Nocera
Posted on August 23, 2020
Deploying to Heroku can be tricky. Here are some tips to get your deployed application working!
Table of Contents
Deployment
Creating a Heroku app using the GUI
- Navigate to your Heroku account
- Click New > Create new app and enter a name for the app
- Under Deploy > Deployment Method > Select Github
- Enter the Github repo name and connect
- Enable Automatic deploys to automatically update Heroku with updates to master (otherwise need to use
git push heroku master
) - Navigate to your repo in the terminal
- View remotes, there should be no heroku remotes yet, just origin from github:
git remote -v
- Create a remote for your app:
heroku git:remote -a [heroku app name]
- Verify you see a heroku remote;
git remote -v
OAuth
- Add the
clientID
andclientSecret
as keys with the corresponding values in Config Vars on Heroku - In the OAuth app, add the Heroku URL as the Homepage and Callback URL
- Ensure the passport routes to
/
as the homepage. Redirect to the authentication path if necessary
app.get("/", passport.authenticate("github"), function (req, res) {
res.redirect("/auth/github");
});
- Setup for
clientID
andclientSecret
:
{
clientID: process.env.clientID,
clientSecret: process.env.clientSecret,
callbackURL: "/auth/github/callback",
},
Options for testing locally with OAuth
After changes made to deploy to Heroku
In server.js, update
clientID
andclientSecret
to be hardcoded string values; return toprocess.env.clientID
andprocess.env.clientSecret
prior to pushing changesCreate a new OAuth app and configure for
localhost
. Setup theclientID
andclientSecret
to useprocess.env
on Heroku, but the localhost configured app otherwise:
clientID: process.env.clientID || [new_locahost_clientID_here],
clientSecret: process.env.clientSecret || [new_localhost_clientSecret_here],
- Create a
.env
file, addclientID="{clientID}"
andclientSecret="{clientSecret}"
. Be sure to add.env
to.gitignore
.npm i dotenv
and followdotenv
setup instructions
JawsDB for MySQL
- From the Overview tab on the Heroku app, select "Configure Add-ons"
- Search for JawsDB MySQL and attach the add-on
- Click the JawsDB link for connection info
- Go to MySQL Workbench to setup a new connection
- Enter the host, username, and password info and test the connection (ensure you don't accidentally paste extra spaces)
- Open the connection and if it was successful, you should see a sole database that is a string of gibberish (don't rename)
- No need to create tables as that will created via Sequelize
- In Heroku, go to Settings > Config Vars > Reveal Config Vars
- Verify there is a config var for JAWSDB_URL with the URL value
- In
config.json
, configure the "production" property as follows:
"production": {
"dialect": "mysql",
"use_env_variable": "JAWSDB_URL"
}
mLab for MongoDB / Mongoose
_mLab is now depreciated. Use MongoDB Atlas (below) instead.
- Run this command to provision mLab to the app:
heroku addons:create mongolab
- Navigate to Heroku app and verify the mLab add-on is provisioned
- Navigate to Settings > Config vars and verify there is a
MONGODB_URL
config variable - Ensure
mongoose
is required inserver.js
- Update Mongoose connection in
server.js
to be the following:
var MONGODB_URI = process.env.MONGODB_URI || "mongodb://localhost/db_name";
const options = {
useNewUrlParser: true,
useCreateIndex: true,
useFindAndModify: false,
};
mongoose.connect(MONGODB_URI,options)
MongoDB Atlas for MongoDB
MongoDB Atlas Account
- Create your MongoDB Atlas account
- Create a new "cluster"
- Select the free tier
- Can use any provider - such as AWS
- Choose the server in the region in the free tier closest to you
- After creating the cluster, in the cluster, go to Security > Database Access
- +Add new database user
- Add username/password
- Change privileges to Atlas Admin
- Go to Security > Network Access
- Go to Add IP Address and select Allow Access from Anywhere
- Go to Clusters > Collections > Add My Own Data
- Add your database name and one collection name (only need to add one to get started even if you have multiple collections since they will be created by Mongoose)
Connecting MongoDB Atlas to Heroku
- Click the Connect button in your cluster
- Select Connect Your Application and choose Heorku
- Copy the string
- Go to your app in Heroku > Settings > Config Vars
- Enter MONGODB_URI in the key
- For the value, paste the string you copied from MongoDB Atlas
- Update the username/password and database name in the string to match what you created in the MongoDB Atlas Setup
- Ensure you look to MONGODB_URI in you Mongoose connection (likely in server.js)
mongoose.connect(
process.env.MONGODB_URI || "mongodb://localhost/databasename",
{
useUnifiedTopology: true,
useNewUrlParser: true,
useCreateIndex: true,
useFindAndModify: false,
}
);
💖 💪 🙅 🚩
Darian Nocera
Posted on August 23, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.