Difference between revisions of "Emergent Web Technologies Spring 2009 Class 6"
(New page: == Introduction == This week we'll finish up with an introduction to Ruby and move on to Ruby on Rails. We'll start with an introduction to web frameworks in general, and then move on to ...) |
|||
(11 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
+ | [[Emergent_Web_Technologies_Spring_2009|Back to EWT Spring 2009]] | ||
+ | |||
== Introduction == | == Introduction == | ||
This week we'll finish up with an introduction to Ruby and move on to Ruby on Rails. We'll start with an introduction to web frameworks in general, and then move on to [http://en.wikipedia.org/wiki/Model_view_controller Model View Controller]. Finally, we'll build a small Rails app in class to demonstrate how much more quickly you can build applications if you have a framework to start with. | This week we'll finish up with an introduction to Ruby and move on to Ruby on Rails. We'll start with an introduction to web frameworks in general, and then move on to [http://en.wikipedia.org/wiki/Model_view_controller Model View Controller]. Finally, we'll build a small Rails app in class to demonstrate how much more quickly you can build applications if you have a framework to start with. | ||
+ | |||
+ | == Resources == | ||
+ | |||
+ | === Model View Controller === | ||
+ | * [http://en.wikipedia.org/wiki/Model_view_controller Wiki article on Model View Controller] | ||
+ | * [http://betterexplained.com/articles/intermediate-rails-understanding-models-views-and-controllers/ MVC in Rails] | ||
+ | |||
+ | === Command Line Tutorials === | ||
+ | * [http://physiology.med.unc.edu/wwwMHMF/how-to/work-with-cmd/default.html Windows Tutorial] | ||
+ | * [http://www.bleepingcomputer.com/tutorials/tutorial76.html Another Windows Tutorial] | ||
+ | * [http://osxdaily.com/2007/02/07/basic-command-line-utilities-tips-commands/ OS X Tutorial] | ||
+ | |||
+ | === Ruby on Rails === | ||
+ | * [http://rubyonrails.org/ Ruby on Rails Homepage] | ||
+ | * [http://betterexplained.com/articles/starting-ruby-on-rails-what-i-wish-i-knew/ Intro to Rails] | ||
+ | * [http://media.rubyonrails.org/video/rails_blog_2.mov 15 Minute Weblog Tutorial Video] | ||
+ | * [http://guides.rubyonrails.org/getting_started.html Getting Started Guide] | ||
+ | * [http://guides.rubyonrails.org/ Rails Guides] | ||
+ | * [http://railscasts.com/ Railscasts (screencasts about Rails topics)] | ||
+ | |||
+ | == In Class Activity 1 == | ||
+ | |||
+ | Develop a simple Ruby class that represents a Vehicle. The Vehicle class should have public properties for a registration id and a color. It should also have functions for starting and stopping the vehicle. Make the functions write "started" and "stopped" to the console when the car is started or stopped. | ||
+ | |||
+ | Develop a Car class that inherits from the vehicle class. The Car class should have a new public property for the number of doors. You should should be able to pass in the color and number of doors to the constructor for the car. | ||
+ | |||
+ | Once you have both of the classes created, test out your code by creating a new car and make sure that you can start it and stop it. Also, make sure that you can set the registration id and read back the color and number of doors by printing them out to the console. | ||
+ | |||
+ | Your test code should look something like this | ||
+ | |||
+ | car = Car.new(4, :green) | ||
+ | car.registration_id = 5000 | ||
+ | |||
+ | puts car.registration_id | ||
+ | puts car.color | ||
+ | puts car.number_of_doors | ||
+ | |||
+ | Remember that a Ruby class looks like this | ||
+ | |||
+ | class Vehicle | ||
+ | |||
+ | end | ||
+ | |||
+ | == Commands to Run Before Developing With Rails == | ||
+ | |||
+ | Before you start developing with Ruby on Rails, you'll want to make sure that all of the code associated with Rails is current. These commands will make sure that everything is up to date with the latest versions. | ||
+ | |||
+ | Open the Instant Rails application and right click on the icon in the taskbar. Choose Rails Applications > Open Ruby Console Window. Run this command first | ||
+ | |||
+ | gem install rubygems-update | ||
+ | |||
+ | Once the first command has completed, run this command | ||
+ | |||
+ | update_rubygems | ||
+ | |||
+ | Finally, run this command | ||
+ | |||
+ | gem update rails | ||
+ | |||
+ | You should now be up to date. | ||
+ | |||
+ | == Let's Create Rails Application == | ||
+ | |||
+ | Create your Rails application | ||
+ | |||
+ | rails my_test_app | ||
+ | |||
+ | You should see a list of files that have been created for your application. Let's see if it works. | ||
+ | |||
+ | cd my_test_app | ||
+ | ruby script/server | ||
+ | |||
+ | Now open a browser and navigate to http://localhost:3000. | ||
+ | |||
+ | Now, let's start creating some pages. Create a new controller for a page about widgets. First you'll need to stop the server by hitting ctrl + c in your console window. Then type this: | ||
+ | |||
+ | ruby script/generate controller Widgets | ||
+ | |||
+ | Notice that a controller has been created at | ||
+ | |||
+ | app/controllers/widgets_controller.rb. | ||
+ | |||
+ | Open the file and add an new action to it. Let's call it list: | ||
+ | |||
+ | def list | ||
+ | render :text => "This is a list" | ||
+ | end | ||
+ | |||
+ | Start the server back up again and open http://localhost:3000/widgets/list. You should see the text "This is a list". | ||
+ | |||
+ | Take out the render text line and create a template instead. Open the folder at | ||
+ | |||
+ | /app/views/widgets/ | ||
+ | |||
+ | and create a new file called | ||
+ | |||
+ | list.html.erb | ||
+ | |||
+ | Let's make the page a little more dynamic by passing a variable to the view. Create a new variable to pass to the view for the number of widgets. Add this to your controller | ||
+ | |||
+ | def list | ||
+ | @widget_count = 50 | ||
+ | end | ||
+ | |||
+ | And update your view so that it shows the number of widgets | ||
+ | |||
+ | There are <%= @widget_count %> widgets | ||
+ | |||
+ | Or pass along a collection. Add this to your controller | ||
+ | |||
+ | @widgets = [:widget1, :widget2, :widget3] | ||
+ | |||
+ | And modify your view so it looks like this | ||
+ | |||
+ | <ul> | ||
+ | <% @widgets.each do |widget| -%> | ||
+ | <li><%= widget %></li> | ||
+ | <% end -%> | ||
+ | </ul> | ||
+ | |||
+ | == Let's Build the Scaffold for a Real Site == | ||
+ | |||
+ | Create a scaffold your a site that stores locations | ||
+ | |||
+ | ruby script/generate scaffold Location name:string address:string latitude:float longitude:float | ||
+ | |||
+ | This script just created the necessary models, views and controllers for managing your locations. But you still need to build the right tables in the database. Run this command to do that automatically | ||
+ | |||
+ | rake db:migrate | ||
+ | |||
+ | Now your database has been updated. Open http://localhost:3000/locations and notice that a basic site for creating and editing locations has been built for you. | ||
+ | |||
+ | Let's say that you forgot to add the city, state and zip to your database. Use a migration to add that information to your database. | ||
+ | |||
+ | ruby script/generate migration AddCityStateZipToLocations | ||
+ | |||
+ | Now navigate to the file and open it | ||
+ | |||
+ | db/migrate/[some date time]_add_city_state_zip_to_locations.rb | ||
+ | |||
+ | Modify the code so it looks like this | ||
+ | |||
+ | class AddCityStateZipToLocations < ActiveRecord::Migration | ||
+ | def self.up | ||
+ | add_column :locations, :city, :string | ||
+ | add_column :locations, :state, :string | ||
+ | add_column :locations, :zip, :string | ||
+ | end | ||
+ | |||
+ | def self.down | ||
+ | remove_column :locations, :city | ||
+ | remove_column :locations, :state | ||
+ | remove_column :locations, :zip | ||
+ | end | ||
+ | end | ||
+ | |||
+ | Now migrate your database again | ||
+ | |||
+ | rake db:migrate | ||
+ | |||
+ | You'll need to update your views and controllers again to reflect these changes. For example, navigate to your edit view. | ||
+ | |||
+ | app/views/locations/edit.html.erb | ||
+ | |||
+ | And add a new form field | ||
+ | |||
+ | <p> | ||
+ | <%= f.label :city %><br /> | ||
+ | <%= f.text_field :city %> | ||
+ | </p> | ||
+ | |||
+ | To see how these urls work, look at the file | ||
+ | |||
+ | config/routes.rb | ||
+ | |||
+ | The line that says | ||
+ | |||
+ | map.resources :locations | ||
+ | |||
+ | is building these urls for you. Also notice that the url http://localhost:3000/locations.xml automatically shows an xml representation for you. | ||
+ | |||
+ | You can manually create your own urls in a lot of different ways. The simplest way is to create a connection like this | ||
+ | |||
+ | map.connect 'locations/list', :controller => 'locations', :action => 'index' | ||
+ | |||
+ | If you restart your server and go to http://localhost:3000/locations/list you will see the same thing that would see if you went to http://localhost:3000/locations/ or http://localhost:3000/locations/index | ||
+ | |||
+ | [[Category:EWT Spring 2009]] |
Latest revision as of 21:08, 18 March 2009
Contents
Introduction
This week we'll finish up with an introduction to Ruby and move on to Ruby on Rails. We'll start with an introduction to web frameworks in general, and then move on to Model View Controller. Finally, we'll build a small Rails app in class to demonstrate how much more quickly you can build applications if you have a framework to start with.
Resources
Model View Controller
Command Line Tutorials
Ruby on Rails
- Ruby on Rails Homepage
- Intro to Rails
- 15 Minute Weblog Tutorial Video
- Getting Started Guide
- Rails Guides
- Railscasts (screencasts about Rails topics)
In Class Activity 1
Develop a simple Ruby class that represents a Vehicle. The Vehicle class should have public properties for a registration id and a color. It should also have functions for starting and stopping the vehicle. Make the functions write "started" and "stopped" to the console when the car is started or stopped.
Develop a Car class that inherits from the vehicle class. The Car class should have a new public property for the number of doors. You should should be able to pass in the color and number of doors to the constructor for the car.
Once you have both of the classes created, test out your code by creating a new car and make sure that you can start it and stop it. Also, make sure that you can set the registration id and read back the color and number of doors by printing them out to the console.
Your test code should look something like this
car = Car.new(4, :green) car.registration_id = 5000 puts car.registration_id puts car.color puts car.number_of_doors
Remember that a Ruby class looks like this
class Vehicle end
Commands to Run Before Developing With Rails
Before you start developing with Ruby on Rails, you'll want to make sure that all of the code associated with Rails is current. These commands will make sure that everything is up to date with the latest versions.
Open the Instant Rails application and right click on the icon in the taskbar. Choose Rails Applications > Open Ruby Console Window. Run this command first
gem install rubygems-update
Once the first command has completed, run this command
update_rubygems
Finally, run this command
gem update rails
You should now be up to date.
Let's Create Rails Application
Create your Rails application
rails my_test_app
You should see a list of files that have been created for your application. Let's see if it works.
cd my_test_app ruby script/server
Now open a browser and navigate to http://localhost:3000.
Now, let's start creating some pages. Create a new controller for a page about widgets. First you'll need to stop the server by hitting ctrl + c in your console window. Then type this:
ruby script/generate controller Widgets
Notice that a controller has been created at
app/controllers/widgets_controller.rb.
Open the file and add an new action to it. Let's call it list:
def list render :text => "This is a list" end
Start the server back up again and open http://localhost:3000/widgets/list. You should see the text "This is a list".
Take out the render text line and create a template instead. Open the folder at
/app/views/widgets/
and create a new file called
list.html.erb
Let's make the page a little more dynamic by passing a variable to the view. Create a new variable to pass to the view for the number of widgets. Add this to your controller
def list @widget_count = 50 end
And update your view so that it shows the number of widgets
There are <%= @widget_count %> widgets
Or pass along a collection. Add this to your controller
@widgets = [:widget1, :widget2, :widget3]
And modify your view so it looks like this
<ul> <% @widgets.each do |widget| -%> <li><%= widget %></li> <% end -%> </ul>
Let's Build the Scaffold for a Real Site
Create a scaffold your a site that stores locations
ruby script/generate scaffold Location name:string address:string latitude:float longitude:float
This script just created the necessary models, views and controllers for managing your locations. But you still need to build the right tables in the database. Run this command to do that automatically
rake db:migrate
Now your database has been updated. Open http://localhost:3000/locations and notice that a basic site for creating and editing locations has been built for you.
Let's say that you forgot to add the city, state and zip to your database. Use a migration to add that information to your database.
ruby script/generate migration AddCityStateZipToLocations
Now navigate to the file and open it
db/migrate/[some date time]_add_city_state_zip_to_locations.rb
Modify the code so it looks like this
class AddCityStateZipToLocations < ActiveRecord::Migration def self.up add_column :locations, :city, :string add_column :locations, :state, :string add_column :locations, :zip, :string end def self.down remove_column :locations, :city remove_column :locations, :state remove_column :locations, :zip end end
Now migrate your database again
rake db:migrate
You'll need to update your views and controllers again to reflect these changes. For example, navigate to your edit view.
app/views/locations/edit.html.erb
And add a new form field
<p> <%= f.label :city %><br /> <%= f.text_field :city %> </p>
To see how these urls work, look at the file
config/routes.rb
The line that says
map.resources :locations
is building these urls for you. Also notice that the url http://localhost:3000/locations.xml automatically shows an xml representation for you.
You can manually create your own urls in a lot of different ways. The simplest way is to create a connection like this
map.connect 'locations/list', :controller => 'locations', :action => 'index'
If you restart your server and go to http://localhost:3000/locations/list you will see the same thing that would see if you went to http://localhost:3000/locations/ or http://localhost:3000/locations/index