How to Deploy a New Rails App to Heroku Through GitHub

The following article takes you through all the steps from initializing your new Rails app to deploying it to Heroku through GitHub. There are a few extra steps, e.g. adding Bootstrap and creating pages with content, which are not essential to this process but make everything look a little nicer.

Use PostgreSQL as Your Database

When creating a new Rails application SQLite3 is the default database used. However you cannot use SQLite3 with Heroku, lucky for us, Rails also supports MySQL (including MariaDB) and PostgreSQL. Since PostgreSQL is the go-to database for Heroku, we will stick with that. To create a new Rails app and change the default database to PostgreSQL, type rails new my-new-app --database=postgresql in your terminal (replace ‘my-new-app’ with your app’s name). cd into the new directory to get started.

test

Add Some Pages to Your App [optional]

Create whichever pages you like - this is just to add some content so we can see if everything is working correctly. I started out with a simple greeting on the home page. In config/routes.rb add root 'welcome#home' and generate a new welcome controller with rails g controller welcome. Add a home action to your WelcomeController and a home.html.erb in the app/views/welcome folder with whatever text you like.

Spin up a server with rails s and navigate to http://localhost:3000 to take a look at your new homepage.

Add Bootstrap Support [optional]

I like my applications to have at least a little styling from the start, to add bootstrap support simply add the following lines in these files:

  • In app/assets/javascripts/application.js add: //= require jquery //= require jquery_ujs //= require bootstrap

before //= require_tree ..

  • In app/assets/stylesheets/application.css add: @import 'bootstrap-sprockets'; @import 'bootstrap';

to the bottom of the file and rename the file to have the extension .css.scss.

  • Add these gems to your Gemfile: gem 'bootstrap-sass' gem 'jquery-rails'

and run bundle install.

To see if this worked start up a server with rails s and navigate to http://localhost:3000, you should see the font change.

Move Your Files Into a GitHub Repo

Create a new repository on GitHub and copy its link. Run git remote add origin https://github.com/your-name/your-new-app (pasting your repo link). Add all your files with git add . and commit with git commit -m "Initial commit" or whichever commit message you’d prefer. Push to Github with git push origin master. Next, we will link this repo to our Heroku app.

Deploy to Heroku

Go to https://dashboard.heroku.com/apps and sign up for an account if you haven’t yet. Push the Create New App button, name your new Heroku app and create it. Then choose GitHub as your deployment method and type in your repo name. Choose Enable Automatic Deployments if you wish and hit Deploy Branch. The deployment will run for a little while so be patient. After that’s done a View button will pop up, click on it and check out your masterpiece.

Using a Database [optional but helpful]

To see how your app will run with some database content, create a new resource with rails g resource Item name:string. Go to your config/database.yml and find the name of your development database, e.g. my_new_app_development.

Create a new Database

To create a new database in PostgreSQL enter createdb my_new_app_development (make sure the database name ‘my_new_app_development’ matches the one in your database.yml file). After running rake db:migrate and your database should be all set. To test everything out, create a new object in your rails console, rails c, e.g. Item.create(name: 'Puzzle').

Add Appropriate Views

Add some views to display your objects. Create an index action in your ItemController saving all your objects in an instance variable. Create a new index view in your views/items folder and iterate over your newly created instance variable to display your objects names for example.

Create a link to this page on your welcome home page <%= link_to 'Item Index', items_path %> for easier access.

…Back to Heroku

Make sure you add, commit and push you new changes to GitHub. Now go back to your heroku app; if you have automatic deployment enabled, wait a while for everything to update and refresh your page; you should see your new content. In order to use the database on Heroku, you have to run rake db:migrate in your Heroku console and all your pages should work.

Have fun creating your new live Rails app!

Comments