Heroku Setup Guide for Gather Projects

Hello Everyone!

One of the best ways to host Gather projects on a server for free (or really affordably) is to do so on Heroku. I’ve heard lots of questions during office hours with @opalrose and she asked me to write up a post that would help to explain the process. :smiley:

Here is my attempt to provide some basic steps to get your code hosted and running on Heroku:

  1. Create a new app on Heroku by clicking on the “New” button dropdown in the top right corner

  2. Name your app and click “Create app”

  3. Click on the “Deploy” tab and choose your “Deployment method”

  4. In this guide, I’m choosing Github
    a. If you don’t have a Git repository setup yet, then navigate to www.github.com and create one
    i. Upload your files
    1) Make sure you’ve specified your API_KEY, SPACE_ID, and MAP_ID in your config
    ii. Be sure to include express in your package.json
    iii. Here’s a helpful doc on installing express and what to include: How to deploy your app to the web using Express.js and Heroku
    iv. TLDR express code required:
    const express = require(“express”);
    const app = express();
    // use alternate localhost and the port Heroku assigns to $PORT
    const host = ‘0.0.0.0’;
    const port = process.env.PORT || 3000;

     	app.listen(port, host, function() {
     	  console.log("Server started.......");
     	});
    
  5. Search for your GitHub Repo in the “Connect to GitHub” section and click “Connect”

  6. Choose to “Enable Automatic Deploys” or just go ahead and “Deploy Branch”
    Click on “More” => “View Logs” to watch everything spin up successfully!

Good luck and hope it helps! Looking forward to seeing all of the cool projects you serve on Heroku! :+1:

3 Likes

Great writeup Kevin.

You can also avoid the use of express by setting the heroku dyno to a worker dyno, instead of a web dyno. The worker dynos run 100% of the time, so if you have limited processing time on the server (ie a pay-as-you-go setup), this might not be ideal. However, there is at least 1000 hours of free dyno time a month that users can access, which would allow you to deploy at least 1 extension for free for the month.

Ill come back and add more detail this evening.

3 Likes

This is great, thanks Kevin. I finally set this up on Heroku so sharing a couple things I came up against:
NB I’m using Bill’s gt-helper.
To setup Github I used the Github desktop app, and created a repository from the working folder on my computer. This is prob obvious, but having the desktop app meant that uploading and updating files was easy.
To include express in my package.json, I ran “npm install express --save”. (I think that’s what worked in the end).
I added the code for Express into my app.ts file, but the double and single quotation marks copied across badly so that’s worth checking:
const express = require(“express”);
const app = express();
// use alternate localhost and the port Heroku assigns to $PORT
const host = ‘0.0.0.0’;
const port = process.env.PORT || 3000;
app.listen(port, host, function() {
console.log(“Server started…”);
});

I haven’t figured out how to wake up the web dyno effectively yet, or change it to a worker dyno, so that’s next. Thanks for the writeup!

Just to try and help, though I do not have the a full write up at all, you should be able to get away with creating a ‘Procfile’ with the line worker: npm start in it. There are likely other steps, such as setting the Start script in the package.json file, but hopefully that tip at least gets you into a worker dyno.