Estimated Time to Read this article and complete demos: 10 minutes
Today, we're announcing the availability of a RubyGem that helps you quickly add Kendo UI to your Rails applications. In this post, I'll share an overview of the Gem, a quick tutorial on how to use it, and even a video of the new Gem in action.
In addition to putting together some killer features for the next release of Kendo UI (have you seen the latest beta
? It's awesome!) we also want to give you the best resources for building awesome sites and applications with Kendo UI. Along those lines, we've created a RubyGem for using Kendo in Rails applications that we'd like to share with you today.
The gem, which is designed to get Kendo into your Rails apps with little manual effort on your part, is called 'kendoui-rails
.' If you want the sources, check it out over at https://github.com/kendo-labs/kendo-rails
, and feel free to fork it, send us pull-requests, enter issues or offer any other kind of feedback you think we need. (Licensing Note: This Gem currently provides a GPLv3-licensed version of the latest major release of Kendo UI.)
Cool. How do I use it?
Getting started with the Gem is simple, just create a new Rails application (if you already have one, skip this step). Mine is called 'shoe_fodder':
$ rails new shoe_fodder
$ cd shoe_fodder
Then, edit your Gemfile by adding a reference to the gem, just after `gem 'jquery-rails'`:
Now, return to your console and run `bundle install.` Check that wall of text that Bundler sends your way to confirm that kendoui-rails (v0.0.5 at the time of this post) has been properly installed.
$ rails generate kendoui:install
//= require kendo/kendo.all.min
/* app/assets/stylesheets/application.css */
*= require kendo/kendo.common.min
*= require kendo/kendo.default.min
If, on the other hand, you're using Rails 3.0 or previous, or have the asset pipeline disabled, the Gem will manually copy all the needed assets into your `public/` folder. From there, you can add the proper `<link>` and `<script>` references for Kendo, and you're off to the races!
But I want to use another theme!
Ok, we have a switch for that. You no doubt noticed that the generator command used the 'default' theme upon installation. 'default' is, of course, the default, but you can use the '--theme' switch on the generator command to install another theme instead. Let's say I prefer BlueOpal:
$ rails generate kendoui:install -- theme=blueopal
Scaffold, Migrate, Add Kendo and Go!
Now that I've added Kendo UI into my rails app, I can do some quick scaffolding to see just how easy it is to use. I'll run the following in my terminal to generate a `shoe` model, including views and controller:
$ rails g scaffold shoe name price:decimal url replacement_mileage
Once that's finished, I'll migrate the database:
$ rake db:migrate
Now, I'll navigate to my `shoes/new` view and add some Kendo goodness to the bottom of the page. In this case, an AutoComplete box that provides some assitance to the user when naming a new shoe:
$("#shoe_name").kendoAutoComplete(["Nike Free", "Saucony Series 7", "Vibram Five Fingers"]);
Then, I'll start up my server
$ rails server
And, open up a browser at localhost:3000/shoes/new.
That's it! I'm rocking and rolling with Rails and Kendo UI from scratch in under three minutes. Or two minutes and twenty-seven seconds, to be exact. To show you just how quick this whole process can be--and prove that I didn't make that 2:27 figure up--I recorded myself going through the exact same steps as above. Check out the embedded video below, or watch it over on our YouTube channel (Note: be sure to watch in Fullscreen mode to get all of the detail.)
See the Gem in Action
Give us Your Feedback!
So what do you think? Is this Gem useful for your development? Let us know what you think here, and feel free to also suggest improvements, new features or anything here or over at the GitHub Repo.
Now, who's going to implement the first Rails app using this Gem?
kendoui-rails on GitHub
kendoui-rails at RubyGems.org
Screencast on YouTube