CSCI-2325 Web Programming: Ruby on Rails Mohammad T . Irfan Plan - - PDF document

11/19/14 ¡ 1 ¡

CSCI-2325 Web Programming: Ruby on Rails

Mohammad T . Irfan

Plan

u Model-View-Controller (MVC) framework of

web programming

u Ruby on Rails

11/19/14 ¡ 2 ¡

Ruby on Rails

u Developed by David Hansson – released 2004 u MVC architecture

u MVC by Trygve Reenskaug, 1979 u GUI for Smalltalk

u Learning Resources

u Quick guide

http://guides.rubyonrails.org/ getting_started.html

u Best online book

http://ruby.railstutorial.org/chapters/beginning

Interview of David H. Hansson

u “Ruby Is Closer to Human Thought Than to Code”

u http://bigthink.com/users/davidheinemeierhansson

11/19/14 ¡ 3 ¡

Ruby on Rails – MVC framework

u Goal

u Decouple the three parts of an application

u Model

u Database u Constraints on data u Object Relational Mapping (ORM)

u Maps tables to classes, rows to objects u Called ActiveRecord

Ruby on Rails – MVC framework

u View

u Prepares and presents results for users u Templates

u XHTML u XML u Javascript

11/19/14 ¡ 4 ¡

Ruby on Rails – MVC framework

u Controller

u Takes user input u Consults with model u Directs the view

u The basic codes are auto-generated

Getting started

u New web application (Aptana Studio 3)

u Create a new Rails project u Or, from the terminal inside Aptana Studio 3

u rails new projectName

u Windows users: open Gemlock.lock file, change

“sqlite 3 (1.3.8-...)” to “sqlite 3 (1.3.8)” u Start the server

u Command (you may use Aptana terminal)

u rails server

u Open a browser and go to

http://localhost:3000/

u Welcome aboard

11/19/14 ¡ 5 ¡

Browse the project folders

u App

u models u views u controllers

Scaffolding

u Fast process of generating start-up codes u First, design a schema u Command for ORM

u rails generate scaffold Student bID:string name:string

email:string

u Other useful commands: rails destroy scaffold ...

(delete a previous ORM)

bID name email B01224 Bob bob@bowdoin.edu ... ... ... ... ... ... students

11/19/14 ¡ 6 ¡

Migrate model to DB

u Command for migration

u bundle exec rake db:migrate u Reverse is: rake db:rollback (don’t run it now)

u rake

u Ruby’s make

u configure, make, make install

View the webpage

u Command

u rails s

u s is shortcut for server

u Go to http://localhost:3000 on web browser

u No surprise there

11/19/14 ¡ 7 ¡

Surprise!

u Navigate to http://localhost:3000/students

What’s going on?

• 1. Chrome: http://localhost:3000/students
• 2. <Ruby Router> routes to

students_controller.rb

• 3. students_controller.rb gets data from

database table students

• 4. students_controller.rb feeds data to

View<index.html.erb> (erb = embedded Ruby)

• 5. index.html.erb produces a nice html file and

gives it to students_controller.rb

• 6. students_controller.rb gives that html file to

Chrome

11/19/14 ¡ 8 ¡

Rails router

u config/routes.rb

u resources :students

u Routes to app/controllers/

students_controller.rb

u class StudentsController <

ApplicationController ... # GET /students/new

def new @student = Student.new end ... end

models/ student.rb

Rails architecture

u Representational State Transfer (REST)

u Roy Fielding (2000) – “architectural style”

u Clients communicate with web service

u Limited number of verbs u Resources (nouns) – identified by URI

u Rails

u Nouns: objects (tables) in ORM u Verbs: Read, create, update, delete

u HTTP

u Nouns: URL u Verbs: GET

, POST , PATCH, DELETE

11/19/14 ¡ 9 ¡

Creating a new website

With its own controller

u Command

u rails generate controller MyHomePage home

contact --no-test-framework u Controller class u Views

11/19/14 ¡ 10 ¡

Navigating to my_home_page/home...

u The home method of the Controller class is

executed first

u Empty for now

u Then the corresponding view is executed

u home.html.erb u You may edit it as you like

Adding a page without adding new controller

u First, modify config/route.rb

u get “my_home_page/projects”

u Modify the controller class in

my_home_page_controller.rb

u def projects u end

u Create view

u Add a new projects.html.erb file in views/

my_home_page folder u Any content: <h1>Here are my Ruby projects</h1> <%= image_tag "Ruby_logo.png"%>

Put it in app/assets/images

More here: http://guides.rubyonrails.org/ layouts_and_rendering.html

11/19/14 ¡ 11 ¡

CSCI-2325 Web Programming: More on Ruby on Rails

Mohammad T . Irfan

Roadmap

u Is there a final exam?

u No

u Is there a big final project?

u Already done

u Future assignments

u Rails (Due 12/3) u Haskell (Due 12/10) u Prolog (Due 12/19)

11/19/14 ¡ 12 ¡

Assignment on Rails Groups of 2 students (Individual submission allowed)

u Create a Ruby-on-Rails project u Open-ended u Most basic requirements

u Take user input u Process that input u Work with database u Show some output u Work with non-textual data

u Using other gems is strongly recommended

Review

u Ruby vs. Rails

11/19/14 ¡ 13 ¡

Doing everything from scratch

Plan

u Rails web application

u A more involved example u Without scaffolding u Understand flow of control

u Problem: web service with database

connectivity – auction

u Input: name and bid amount u Store bid information in database u Output: show all bids in sorted order

11/19/14 ¡ 14 ¡

Google this picture Download it (Copy to assets later)

First Step

u Create an application

u rails new AuctionApp

u Create a controller – the only controller

u rails generate controller AuctionApp index

11/19/14 ¡ 15 ¡

Routing – config/routes.rb

u Make the index page the root (http://localhost:3000)

u root “auction_app#index”

u Other routing information (previously these were done

automatically when you said resources :students)

u get "/auction_app" => “auction_app#index” u get "/" => “auction_app#index” u post "/" => “auction_app#enterBid”

Start the server

u You must cd to the appropriate project

folder in terminal—in my case it’s the AuctionApp folder

u rails s

u Open a different terminal for the rest of the

presentation – work in the same folder

11/19/14 ¡ 16 ¡

Model – without scaffolding

u Create a model: ORM

u rails generate model Bid bidder:string amount:float

u Create actual database table

u bundle exec rake db:migrate #creates DB table bids

u Suppose we don’t want a separate controller for

this (want to use auction_app_controller)

u Don’t say resources :bids in routes.rb u If you say so, it will automatically (without writing it

explicitly in routes.rb) map HTTP get, post, etc. to index, create, etc. methods of the bids_controller.rb which we don’t have!

Create the view: HTML way or ERB way

View

11/19/14 ¡ 17 ¡

View (continued) View à Controller

u Action for the “Enter Bid” button

u auction_app/enterBid: enterBid method in

auction_app_controller

u Next: write this method

u This is the method that will be called when the

“submit” button is pressed

u You are allowed to pick any name for the method

11/19/14 ¡ 18 ¡ Controller

Method name Argument: responder obj. Body

More: http://bit.ly/1p1L8AR

DB functionalities

u newRow.save u newRow.update u newRow.destroy u Bid.find(map)

11/19/14 ¡ 19 ¡

bids table in sqlite3

Flow of control

u localhost:3000

è routes.rb routes it to auction_app_controller’s index method è shows output of index.html.erb

u Enter data in form and press “Enter Bid”

button è routes.rb routes it auction_app_controller’s enterBid method (why not the index method?) è Redirects to homepage