Web Development With Ruby - From Simple To Complex

Web Development With Ruby From simple to complex twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 1

Ruby developers have greatly inﬂuenced web development. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 2

ASP.Net MVC and NuPack twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 3 Pretty hot stuff. Inspired by Rails and RubyGems, two things we Rubyists have used to build quality stuff for years.

With Ruby we can •Make HTML and CSS better •Quickly prototype or build simple web sites •Automate complicated builds or deployments •Build simple micro-apps •Implement Web Sockets servers •Improve communication between customers and developers •while also testing our web sites •Build complex apps that interface with legacy system twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 4

All made possible by the highly dynamic features of the twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 5

So, what is Ruby? • Highly dynamic • Very high level • 100% object oriented • 100% open-source • Really easy to learn Sunday, October 10, 2010 6 Highly dynamic, high level, 100% object oriented, 100% open source, and really easy to learn.

History Smalltalk C++ Ruby Java VB 6 C# (1983) (1989) (1993) (1995) (1996) (2000) twitter: bphogan email: brianhogan at napcs.com Sunday, October 10, 2010 7 Ruby was created by Yukihiro Matsumoto (Matz) in 1993. It’s built on C, and has many implementations, including JRuby, which runs on the JVM, and IronRuby, which runs on the .Net platform.

twitter: bphogan email: brianhogan at napcs.com Sunday, October 10, 2010 8 “How you feel is more important than what you do. “ The entire language is designed for programmer productivity and fun.

Basic Ruby twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 9

5 + 5 10 * 10 "Hello" + "World" 25 / 5 twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 10 We have numbers, strings, multiplication, addition, subtraction, and division, just like everyone else.

age = 42 first_name = "Homer" start_date = Date.new 1980, 06, 05 annual_salary = 100000.00 twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 11 It also helps that the syntax is simple. There are no unnecessary semicolons or curly braces. The interpreter knows when lines end.

Ruby follows the Principle of Least Surprise. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 12 Principle of Least Surprise - This means The language should behave in a way that is not confusing to experienced developers. It doesn’t mean that it works like your current favorite language! But as you get used to Ruby, you’ll ﬁnd that you ramp up quickly.

"Brian".length ["red", "green", "blue"].length [:first_name => "Brian", :last_name => "Hogan"].length User.find_all_by_last_name("Hogan").length twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 13 Ruby achieves this through a consistant API. You won’t ﬁnd yourself guessing too much what methods are available to you.

Arrays colors = ["Red", "Green", "Blue"] Sunday, October 10, 2010 14 The square brackets denote an array.

Hashes (Dictionaries) attributes = {:age => 25, :first_name => "Homer", :last_name => "Simpson"} Sunday, October 10, 2010 15

=> Sunday, October 10, 2010 16 This is the hash symbol, or the hash rocket. Whenever you see this, you’re dealing with a hash.

:foo twitter: bphogan email: brianhogan at napcs.com Sunday, October 10, 2010 17 When you see these, you’re looking at Symbols. They represent names and some strings. They conserve memory, as repeating a symbol in your code uses the same memory reference, whereas repeating a string creates a new object on each use.

Simple control logic if on_probation(start_date) puts "Yes" else puts "no" end Sunday, October 10, 2010 18

Methods (functions) are simple too. # if start date + 6 months is > today def on_probation?(start_date) (start_date >> 6) > Date.today end Sunday, October 10, 2010 19 The two arrows (>>) is actually a method on the Date object that adds months. So here, we’re adding six months to the start date and comparing it to today Notice here that the input parameter is assumed to be a date. There’s no type checking here.

Let Ruby write code for you! class Person @started_on = Date.today @name = "" def started_on=(date) class Person @started_on = date end attr_accessor :name attr_accessor :started_on def started_on @started_on end end def name=(name) @name = name end def name @name end end Sunday, October 10, 2010 20 Making getters and setters is so common that Ruby can do it for you.

def test_user_hired_today_should_be_on_probation person = Person.new person.hired_on = Date.today assert person.on_probation? end test_user_hired_last_year_should_not_be_on_probation person = Person.new person.hired_on = 1.year.ago assert !person.on_probation? end Sunday, October 10, 2010 21 Here we have two tests, one using a person hired today, and another using a person last year.

Implement the method class Person attr_accessor :name, :start_date def on_probation? (start_date >> 6) > Date.today end end Sunday, October 10, 2010 22 Watch as the tests pass.

haml and sass twitter: bphogan email: brianhogan at napcs.com Sunday, October 10, 2010 23

HAML !!! #wrapper.container_12 #header.grid_12 %h1 The awesome site %ul#navbar.grid_12 %li %a{:href => "index.html"} Home %li %a{:href => "products"} Products %li %a{:href => "services"} Services #middle.grid_12 %h2 Welcome #footer.grid_12 %p Copyright 2010 AwesomeCo Sunday, October 10, 2010 24

HTML <div class='container_12' id='wrapper'> <div class='grid_12' id='header'> <h1>The awesome site</h1> </div> <ul class='grid_12' id='navbar'> <li> <a href='index.html'>Home</a> </li> <li> <a href='products'>Products</a> </li> <li> <a href='services'>Services</a> </li> </ul> <div class='grid_12' id='middle'> <h2>Welcome</h2> </div> <div class='grid_12' id='footer'> <p>Copyright 2010 AwesomeCo</p> </div> </div> Sunday, October 10, 2010 25

SASS $the_border: 1px $base_color: #111 #header color: $base_color * 3 border-left: $the_border border-right: $the_border * 2 color: red a font-weight: bold text-decoration: none Sunday, October 10, 2010 26

CSS #header { color: #333333; border-left: 1px; border-right: 2px; color: red; } #header a { font-weight: bold; text-decoration: none; } Sunday, October 10, 2010 27

$the_border: 1px $base_color: #111 #header { #header color: #333333; color: $base_color * 3 border-left: 1px; border-left: $the_border border-right: 2px; border-right: $the_border * 2 color: red; } color: red #header a { font-weight: bold; a text-decoration: none; } font-weight: bold text-decoration: none twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 28

Demos twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 29

StaticMatic http://staticmatic.rubyforge.org/ twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 30

src layouts site application.haml index.html pages images index.html javascripts stylesheets stylesheets application.sass application.css twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 31 StaticMatic is a tiny framework for building static websites quickly using HAML and SASS.

Rake twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 32

Automation Language Deploy with a single command! twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 33

Rakeﬁles have tasks desc "Copies the site to our remote server" task :deploy do puts "*** Deploying the site via SSH to #{ssh_user}" system("rsync -avz --delete #{upload_files}/ #{ssh_user}:# {remote_root}") FileUtils.rm_rf upload_files rescue nil end rake deploy twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 34

StaticMatic and Rake demo twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 35 Let’s put a site online

Sinatra http://www.sinatrarb.com/intro twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 36 Sinatra is a great way to build simple web apps with Ruby.

Great for micro apps twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 37

Hello Sinatra! require 'rubygems' require 'sinatra' get "/" do "Hello Sinatra!" end Sunday, October 10, 2010 38 Sinatra is a simple web framework that basically maps incoming requests to backend code that produces responses.

Sunday, October 10, 2010 39 That little bit of code gets us a working web application that handles requests.

Sinatra demos twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 40

Composable apps? Sure! twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 41

conﬁg.ru require 'rubygems' require 'sinatra' # include our Application code require File.join(File.dirname(__FILE__), 'main') require File.join(File.dirname(__FILE__), 'blog') Sinatra Apps # disable sinatra's auto-application starting disable :run map "/" do run Main end Mounting map "/blog" do to URLs run Blog end twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 42

Testing Web Apps twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 43

cucumber Web application testing for people ﬁrst and computers second twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 44

Plain Text Scenarios! Feature: an advanced google search with Cucumber As an interested developer who wants to automate tasks with Cucumber I want to search Google So that I can find more information on how it works. Scenario: Advanced search Given I go to "http://www.google.com" And I click "Advanced search" And I fill in "as_q" with "cucumber" And I fill in the "any of these unwanted words" field with "pickles" And I select "50 results" from the "Number of results" dropdown And I click the Date, usage rights, numeric range, and more section And I turn on Safe Search When I press "Advanced Search" Then I should see "Cucumber - Making BDD fun" When I click "Cucumber - Making BDD fun" And I click "Wiki" And I click "Gherkin" And I click "Feature Introduction" Then I should see "Feature Introduction" twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 45

Express requirements plainly... twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 46

then run real browsers! twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 47

Demo? twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 48

Radiant System Content Management twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 49 Based on Rails, completely modular, easy to install

Web Sockets twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 50

NodeJS? NoWai! twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 51

EventMachine twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 52

Demo? twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 53 Fi

Finally, Rails twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 54

Opinionated, but ﬂexible. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 55

Demo twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 56

“Use The Right Tool” twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 57 We hear this a lot.

Most people who advocate that mean “The right tool is the one I use” twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 58

I am a “Web” developer ﬁrst and a Ruby developer second. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 59

Ruby is the fastest, best, most productive, and most stable, and lucrative way to build web stuff... twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 60

...for me, for now. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 61 But I still use WordPress for my blogs, I still use PHP for simple web stuff, and I still use Visual Basic to maintain a commercial app I sold years ago. I use ASP

Code examples http://dl.dropbox.com/u/50783/tccc9_ruby_webdev.zip http://github.com/napcs/cucumber_watir twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 62

You have new tools. Go use them. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 63

Web Development With Ruby - From Simple To Complex

by Brian Hogan on Oct 10, 2010

Accessibility

Categories

Upload Details

Usage Rights

1 Embed 4

Statistics

Web Development With Ruby - From Simple To Complex Presentation Transcript