Miles to go ...

Arun Gupta is a Technology Evangelist for Web Services and Web 2.0 Apps at Sun. He was the spec lead for APIs in the Java platform, committer in multiple Open Source projects, participated in standard bodies and contributed to Java EE and SE releases.
« Database-enabled RoR... | Main | Getting Started with... »

http://blogs.sun.com/arungupta/date/20070517 Thursday May 17, 2007

jMaki on Rails For Dummies

Craig announced jMaki on Rails. Here I provide detailed steps to read data from a MySQL database and display it in a jMaki-wrapped Yahoo DataTable widget.

  1. Download NetBeans 6.0 M9 (Full version) and configured to install only "Base IDE", "Java IDE", "Web and Java EE" and "Ruby" modules. A cutting-edge build can be obtained from the hudson build.
  2. Download and install jMaki plug-in in NetBeans update center.
    1. In NetBeans 'Tools', 'Plugins', select 'Downloaded', click on 'Add Plugins ...'.
    2. Select the downloaded .NBM module, click on 'Install'. This will install the jMaki plug-in and restart the IDE.
    3. To verify, go to 'Tools', 'Plugins', select 'Installed'. It should show 'jMaki Ajax support' with '1.6.9.7' version number.
  3. Create a new "Ruby on Rails Application" Project, lets say named 'jmaki_ror'.
  4. Create a new controller by right-clicking the project, select 'Generate ...', select 'controller', specify the Name as 'jmaki' and Views as 'yahoo'.
  5. jMaki-enable the Rails app
    1. Open a command prompt and go to your application directory. Make sure you have a SVN client configured on your machine. Then invoke the following commands:

      script/plugin source http://jmaki-goodies.googlecode.com/svn/trunk/rails_plugins
      script/plugin install jmaki_core
      script/plugin install jmaki_yahoo

      The first step adds the plug-in registry to the list of registries used for searching plug-ins. The second two steps install the core and yahoo plug-ins.
    2. Expand 'Views', right-click on 'layouts', select 'New', select 'Empty RHTML (Embedded Ruby) file ...'. Enter the 'File Name' as 'standard'. This will add 'standard.rhtml' in layouts sub-tree. Enter the following fragment before <body>:

      <head>
        <%= stylesheet_link_tag "jmaki-standard", :media => "all" -%>
        <%= javascript_include_tag "jmaki" -%>
        <%= jmaki_setup -%>
      </head>
    3. Within <body>, add the following fragment:

      <%= @content_for_layout %>
    4. In 'Controllers', 'jmaki_controller.rb', add the following fragment before 'def yahoo' line:

      layout "standard"
  6. Configure the MySQL database
    1. Create database using the command: 'mysqladmin -u root create jmaki_ror_development'. You need to make sure that the database name in this script is changed to match the project name.
    2. Right select the NetBeans project, select 'Generate', select 'model', specify the arguments as 'grid', click 'OK'. This will generate, in NetBeans project, Database Migrations, migrate, 001_create_grids.rb.
    3. Open 001_create_grids.rb, change self.up helper method such that it looks like:

      def self.up
        create_table :grids do |t|
          t.column :company, :string
          t.column :price, :float
          t.column :change, :float
          t.column :percent_change, :float
          t.column :last_updated, :string
        end
      end 
    4. Right-select NetBeans project, select 'Run Rake Target', 'db', 'migrate'. This generates the database table. Execute the following query to insert data into the table:

      insert into grids values (1, 'A Co', 71.72, 0.02, 0.03, 'Jan 1, 2007, 10:00am' );
      insert into grids values (2, 'B Inc', 29.01, 0.42, 1.47, 'Feb 1, 2007, 10:00am' );
      insert into grids values (3, 'C Group Inc', 83.81, 0.28, 0.34, 'Mar 1, 2007, 10:00am' );
      insert into grids values (4, 'D Company', 52.55, 0.01, 0.02, 'Apr 1, 2007, 10:00am' );
  7. Add jMaki-wrapped Yahoo DataTable widget
    1. In NetBeans project, in 'Views', 'jmaki', 'yahoo.rhtml', drag-and-drop 'Data Table' widget from the 'Yahoo' category of jMaki palette.
      1. Until the jMaki data model for grid and data widgets is consistent between Java and JRuby, you need to replace the generated code in 'yahoo.rhtml' with the following:

        <%= jmaki_widget 'yahoo.dataTable',
            :args => {
                :columns => [
                    { :title => 'Company', :width => 200, :locked => false },
                    { :title => 'Price', :width => 75, :renderer => 'usMoney' },
                    { :title => 'Change', :width => 75, :renderer => 'change' },
                    { :title => '% Change', :width => 75, :renderer => 'pctChange' },
                    { :title => 'Last Updated', :width => 85, :renderer => 'italic' }
                ]
            },
        :value => @table_data
        -%>
      2. '@table_data' is defined in 'jmaki_controller' in 'def yahoo' as:

        def yahoo
            @table_data = []
            Grid.find_all().each do |data|
              @table_data << [ data.company, data.price, data.change, data.percent_change, data.last_updated]
            end
        end
  8. That's it, run your app and view the page at 'http://localhost:3000/jmaki/yahoo'. Now jMaki-wrapped Yahoo DataTable widget is picking data from the MySQL database. 

And as a next step, you can WAR'up this RoR application and deploy it on GlassFish V2 using these instructions.

Technorati: jmaki rubyonrails ror netbeans mysql glassfish

del.icio.us | furl | simpy | slashdot | technorati | digg
Comments:

[Trackback] Tim Bray, Web Guy from Sun Microsystems gave the keynote session at Rails Conf 2007 yesterday (May 19). With 1600 attendees, it was quite a different experience from JavaOne last week which had approx 16,000 people. The session was to...

Posted by Arun Gupta's Blog on May 20, 2007 at 09:17 AM PDT #

[Trackback] Based upon a user request, this is a follow up entry to show how jMaki on Rails For Dummies work on NetBeans 6 Milestone 10. Some of the steps are simplified and more details are provided. The updates from the...

Posted by Arun Gupta's Blog on July 23, 2007 at 11:21 AM PDT #

Hi, i read your post and do her here

hey, is cool!

The rails is real and today!

Posted by Frederico on August 09, 2007 at 06:25 PM PDT #

Post a Comment:
  • HTML Syntax: NOT allowed
« Database-enabled RoR... | Main | Getting Started with... »

Valid HTML! Valid CSS!

This is a personal weblog, I do not speak for my employer.

--> ajax ajaxworld conf eclipse fitness gem glassfish glassfishday hyderabad india indigo interoperability javaone javaone2008 jax-ws jmaki jpa jruby marathon metro microsoft mysql netbeans phobos photography presos railsconf ruby rubyonrails running runninglog runsfm screencast siliconvalleymarathon sun suntechdays swdp tango theserverside totd training traveltips v3 vista wcf web2.0 webservices windows wsaddressing wsit
Project Tango: Adding Quality of Service and .NET Interoperability to the Metro Web Services Stack
Locations of visitors to this page

calendar

« May 2008
SunMonTueWedThuFriSat
    
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
       
Today

Stats

Today's Page Hits: 8969


Total # blog entries: 594
Total # comments: 1619

www.flickr.com
This is a Flickr badge showing public photos from ArunGupta. Make your own badge here.
Add to Technorati Favorites

Last 50