comment 0

Bootstrap, Authentication, and Deployment in Ruby and Rails – My Experience

See previous blog post – Getting Started with Ruby on Rails – My Experience. The aim there was to get familiar with Ruby and Rails and some of the available tools and perform basic CRUD functionality. In this blog post I share my experience trying to better the look and feel of the application with Bootstrap, implementing standard authentication using Devise and deploying to Heroku.

Heroku allows you to deploy from a number of sources like a connected Dropbox account or GitHub account or a Git repository on your local machine. The nice thing about Heroku is that it offers a free-to-use tier. I tried the Dropbox approach first but then settled with the Git approach. The Netbeans created app fails to deploy to Heroku so I switched to command line Ruby on Rails until I could troubleshoot that Netbeans problem. The Heroku website has good documentation on using Git. I downloaded and installed Git from here. If you are using public GitHub remember to hide your secret values in environment variables in files ignored by git through the .gitignore file.

I found from watching several videos that the Sublime text editor was popular among Ruby on Rails developers. The nice thing about Sublime is that you can open an entire folder of files at once. Heroku does not support sqlite so I switched to Postgres. Heroku also has a Postgres add-on with a free tier. I downloaded and installed Postgres from here for my development environment (my laptop). Didn’t get the below error before but I did today. I just added the gem to the Gemfile and continued along. Weird.

rake db:migrate
Could not load ‘omniauth’. Please ensure you have the omniauth gem >= 1.0.0 installed and listed in your Gemfile. rake aborted!

This video was very helpful in getting Devise to work. This article was helpful in getting Bootstrap working with the application. I encountered the following error at some point and restarting the server made it go away.

@import “boostrap”;
File to import not found or unreadable: bootstrap

Also remember that a partial filename must begin with the underscore else you will get a error message like, “Missing partial shared/_navbar”. I found the following CSS useful to hide the alert and notice containers (if they are empty) that come standard with Devise.

.alert:empty {display: none;}
.notice:empty {display: none;}

Also I found that the login box didn’t need to be as wide as the browser window so I set it to 400px;

.devise-bs {max-width: 400px;}

On smaller screens the navbar buttons collapse to a toggle which was not working for me. I then realised that I missed these lines from the instructions

@import “bootstrap-sprockets”;
//= require bootstrap-sprockets

You can apply bootstrap to your Devise views by utilising this gem. Make sure and not miss the step that says to run this command, rails g devise:views:locale en, else you get the following error

couldn’t find file ‘devise_bootstrap_views’ with type ‘text/css’

The makers of Devise also give guidance on how you can add account approval for new sign ups : How To: Require admin to activate account before sign_in.

You can run rake commands against Heroku as an example, Heroku rake db:migrate. There is also a way to push data from dev to prod and vice versa. You can also use psql to query the database on Heroku but remember to add psql to the PATH in windows through control panel else you will get this error message.

heroku pg:psql
‘psql’ is not recognized as an internal or external command
Add to path under control panel

Also psql commands must end with a semicolon else nothing returns e.g. mytechdemo::DATABASE=> select * from users;

A major component of Devise is getting the mailer configured. Found this blog post extremely useful. I opted to use Figaro (instead of Foreman mentioned in the blog post) to store my environment variables for development. For production (Heroku) I just added them through the web interface although you can use Figaro to push them to Heroku. For Heroku all you need to connect to the database is this line in your database.yml file, url:<%= ENV[‘DATABASE_URL’] %>

bootstrap-authentication-and-deployment-in-ruby-and-rails-my-experience-mailer

Example email notification

You can check out my deployed application at https://mytechdemo.herokuapp.com/ while I work on it some more. Share your thoughts and experiences with us in the comments below and look out for similar blog posts in the future. One of my goals is to create more coding blog posts.

bootstrap-authentication-and-deployment-in-ruby-and-rails-my-experience-screenshot

Screenshot

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s