Five Ways to Manage Front-End Assets in Rails
Strategy One: Download From Source
Just download the code from each website and put it in the
vendor/assets/ directory. This is a simple strategy that is easy to implement right away. It also is somewhat naïve. It’s not automated. Updating the code will be a a slow point-and-click process that is hard to duplicate when you have a new developer on board. You may have to hand-code and copy particular assets to the correct file paths, which is error-prone and time consuming.
Strategy Two: Use a Ruby Gem Including a Rails Engine
There are many ruby gems that package up front-end assets into a convenient and easy to use gem. Bundler is great at managing gems and keeping them up-to-date. But that’s only if the gem’s maintainer keeps the front-end assets current. Unfortunately that doesn’t happen very often and frequently takes a long time. And even worse, each ruby gem packages front-end assets in a slightly different way.
Strategy Three: Use Bower and Configure Rails
npm install -g bower. You’ll have to configure both Bower and Rails to know about each other and install things to the right directory. There are a couple of great guides online on coderwall for this already.
Strategy Four: Use the Bower-Rails gem
Luckily, coders at a company called 42dev created the bower-rails gem. It makes installing and updating Bower packages quite a bit easier. It includes rake tasks for the above, and also has a nice Ruby Domain Specific Language (DSL) for specifying which packages you want included, via a Bowerfile. As of today, the README for the gem is missing a few small steps, so I wrote up an overview of the process for a lightning talk that I gave at the recent Seattle.js meetup at Facebook here in Seattle.
Strategy Five: Use Rails-Assets.org
At last, but most certainly not least, there is a even newer, slicker way to manage your front end assets in ruby projects: RailsAssets.org.
https://rails-assets.org as an additional, new ruby gem source in your
Gemfile, and reference any Bower components as
gem 'rails-assets-BOWER_PACKAGE_NAME'. For example to pull in Twitter bootstrap, you would use
gem 'rails-assets-bootstrap'. Don’t forget to also reference the Bower package name in your asset pipeline (application.js and application.css)
Want to Learn the Professional Tools That the Top Ruby on Rails Developers Use?
Come to one of of our workshops, classes, or bootcamps and learn from us in person!