Rails and Bootstrap

This is a roundup of resources and an announcement of updates from the RailsApps project for Rails and Bootstrap.

I don’t know about you, but I still call it Twitter Bootstrap. It’s now officially Bootstrap so I have to double check everything I write to make sure I’m not calling it Twitter Bootstrap. Anyway, it’s the most popular front-end framework and many people look for guidance to integrate it with Rails.

I introduce front-end frameworks to beginners in the book Learn Ruby on Rails. In the book, I show how to use Zurb Foundation, the second-most popular front-end framework. I don’t have a favorite of the two frameworks but I’ve noticed a slight preference among experienced Rails developers for Foundation. That’s probably because Foundation natively uses the Sass pre-processor which is favored by Rails developers. Also, Zurb provides an officially-supported Rails gem for Foundation. Until now, Rails gems for Bootstrap haven’t been supported by the Bootstrap maintainers, which led to confusion about which gem should be used with Rails, and delays when Bootstrap 3.0 was released. Recently the Bootstrap maintainers selected the bootstrap-sass gem as the official version for future releases, so Bootstrap will continue to be popular among Rails developers.

As a companion to the book, I’ve updated the Rails and Bootstrap tutorial. I wrote it six months ago, for Bootstrap 2.3, and now the updated version covers Bootstrap 3.0. It’s one of the most popular RailsApps tutorials. It’s also a good follow-on tutorial for people who finish the Learn Ruby on Rails book and want to expand their knowledge of Rails and front-end frameworks.

The tutorial is based on the rails-bootstrap starter application, which is available as an open source application on GitHub. You can easily generate the rails-bootstrap starter application with the Rails Composer tool. Which means, if you want to build a new Rails application with Bootstrap, you’ll have a basic application in about two minutes, ready to customize.

The key points of integration for Rails and Bootstrap are:

  • asset pipeline
  • application layout
  • flash messages
  • navigation links

The rails_layout gem is a key ingredient in the starter application. It sets up the application layout, flash messages, and navigation links for either Bootstrap or Foundation. I’ve written a Bootstrap and Rails article that is available for free. The article covers the key points of integration for experienced Rails developers who are looking for a shorter guide to integrating Bootstrap and Rails, showing how to use the rails_layout gem to set up a Rails application.

The Rails and Bootstrap tutorial goes beyond the starter application and free article. It introduces the Bootstrap grid system and components. A walk-through shows how to set up a carousel to display images, showing how Bootstrap components are used in a Rails view. It also shows how to use form helpers with Bootstrap, using a survey form for an example. And it shows how to use modal windows, which are often used with forms in Rails. There are many tutorials that cover the full range of Bootstrap components but almost all are written without considering integration with Rails. I don’t cover all of Bootstrap, just enough so the reader will be comfortable working with Bootstrap and Rails and ready to explore further.

All these resources exist because of the revenue the RailsApps project receives from monthly subscriptions. The goal is simple: make it easy for Rails developers to use Bootstrap or Foundation as a front-end framework. Support from subscribers funds development for the open source rails_layout gem and the Rails Composer tool for starter applications. The open source rails-bootstrap application serves as a reference implementation and example application, with development funded by subscribers. The free Bootstrap and Rails article serves experienced developers. People who want more explanation support the project by subscribing for access to the in-depth Rails and Bootstrap tutorial. Newcomers who need more background can read the book Learn Ruby on Rails, which was funded by a Kickstarter campaign and gets updated as part of the RailsApps project. On behalf of everyone who benefits from the RailsApps project, I’d like to thank the subscribers who provide financial support for the RailsApps project.

Here are links:

1 noteShowHide

  1. rails-apps posted this