5 Ways to Manage Front-End Assets in Rails
Choose one of these five strategies to ensure that you successfully have up-to-date, third-party code included in your app.
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 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 (1, 2) 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
Last, but most certainly not least, there is an 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?
Sign up for one of our workshops, classes, or Development Accelerators and learn from us in person!
Code 301: Intermediate Software Development
What technology is behind creating and launching a web app? Go beyond syntax in Code 301 and learn the top tools and frameworks used by developers around the world.Learn More