SlideShare a Scribd company logo
1 of 63
Download to read offline
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 influenced 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 find 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 find 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
Rakefiles 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
config.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 first 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
                               flexible.

 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
                    first 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

More Related Content

Similar to Web Development With Ruby - From Simple To Complex

Puppet 3: Present and Future Tense
Puppet 3: Present and Future TensePuppet 3: Present and Future Tense
Puppet 3: Present and Future TenseEric Sorenson
 
Puppet 3: Present and Future Tense
Puppet 3: Present and Future TensePuppet 3: Present and Future Tense
Puppet 3: Present and Future TensePuppet
 
OvertheAir 2010 html5 impact on application programming
OvertheAir 2010 html5 impact on application programmingOvertheAir 2010 html5 impact on application programming
OvertheAir 2010 html5 impact on application programmingTor Björn Minde
 
HTML5 impact on application programming
HTML5 impact on application programmingHTML5 impact on application programming
HTML5 impact on application programmingEricsson Labs
 
(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and Ruby Pro...
(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and RubyPro...(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and RubyPro...
(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and Ruby Pro...宏治 高尾
 
Document-Oriented Databases: Couchdb Primer
Document-Oriented Databases: Couchdb PrimerDocument-Oriented Databases: Couchdb Primer
Document-Oriented Databases: Couchdb Primerjsiarto
 
RIA Unleashed - Developing for the TV with litl os
RIA Unleashed - Developing for the TV with litl osRIA Unleashed - Developing for the TV with litl os
RIA Unleashed - Developing for the TV with litl osryancanulla
 
Mirah & Dubious Talk Ruby|Web 2010
Mirah & Dubious Talk Ruby|Web 2010Mirah & Dubious Talk Ruby|Web 2010
Mirah & Dubious Talk Ruby|Web 2010baroquebobcat
 
Persistence Smoothie: Blending SQL and NoSQL (RubyNation Edition)
Persistence  Smoothie: Blending SQL and NoSQL (RubyNation Edition)Persistence  Smoothie: Blending SQL and NoSQL (RubyNation Edition)
Persistence Smoothie: Blending SQL and NoSQL (RubyNation Edition)Michael Bleigh
 
Python Ecosystem for Beginners - PyCon Uruguay 2013
Python Ecosystem for Beginners - PyCon Uruguay 2013Python Ecosystem for Beginners - PyCon Uruguay 2013
Python Ecosystem for Beginners - PyCon Uruguay 2013Hannes Hapke
 
Distributed Social Networking
Distributed Social NetworkingDistributed Social Networking
Distributed Social NetworkingBastian Hofmann
 
10 more-things-you-can-do-with-python
10 more-things-you-can-do-with-python10 more-things-you-can-do-with-python
10 more-things-you-can-do-with-pythonDaniel Greenfeld
 
Jeff mc cune sf 2010
Jeff mc cune sf 2010Jeff mc cune sf 2010
Jeff mc cune sf 2010Puppet
 
Advanced android
Advanced androidAdvanced android
Advanced androiddonnfelker
 
HTML5: Building for a Faster Web
HTML5: Building for a Faster WebHTML5: Building for a Faster Web
HTML5: Building for a Faster WebEric Bidelman
 
Los Angeles R users group - Nov 17 2010 - Part 2
Los Angeles R users group - Nov 17 2010 - Part 2Los Angeles R users group - Nov 17 2010 - Part 2
Los Angeles R users group - Nov 17 2010 - Part 2rusersla
 
Edted 2010 Ruby on Rails
Edted 2010 Ruby on RailsEdted 2010 Ruby on Rails
Edted 2010 Ruby on RailsFabio Akita
 

Similar to Web Development With Ruby - From Simple To Complex (20)

Node.js and Ruby
Node.js and RubyNode.js and Ruby
Node.js and Ruby
 
Puppet 3: Present and Future Tense
Puppet 3: Present and Future TensePuppet 3: Present and Future Tense
Puppet 3: Present and Future Tense
 
Puppet 3: Present and Future Tense
Puppet 3: Present and Future TensePuppet 3: Present and Future Tense
Puppet 3: Present and Future Tense
 
OvertheAir 2010 html5 impact on application programming
OvertheAir 2010 html5 impact on application programmingOvertheAir 2010 html5 impact on application programming
OvertheAir 2010 html5 impact on application programming
 
HTML5 impact on application programming
HTML5 impact on application programmingHTML5 impact on application programming
HTML5 impact on application programming
 
Acronym Soup
Acronym SoupAcronym Soup
Acronym Soup
 
(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and Ruby Pro...
(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and RubyPro...(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and RubyPro...
(final version) KIDS, RUBY, FUN! - Introduction of the Smalruby and Ruby Pro...
 
Document-Oriented Databases: Couchdb Primer
Document-Oriented Databases: Couchdb PrimerDocument-Oriented Databases: Couchdb Primer
Document-Oriented Databases: Couchdb Primer
 
RIA Unleashed - Developing for the TV with litl os
RIA Unleashed - Developing for the TV with litl osRIA Unleashed - Developing for the TV with litl os
RIA Unleashed - Developing for the TV with litl os
 
Mirah & Dubious Talk Ruby|Web 2010
Mirah & Dubious Talk Ruby|Web 2010Mirah & Dubious Talk Ruby|Web 2010
Mirah & Dubious Talk Ruby|Web 2010
 
Persistence Smoothie: Blending SQL and NoSQL (RubyNation Edition)
Persistence  Smoothie: Blending SQL and NoSQL (RubyNation Edition)Persistence  Smoothie: Blending SQL and NoSQL (RubyNation Edition)
Persistence Smoothie: Blending SQL and NoSQL (RubyNation Edition)
 
Python Ecosystem for Beginners - PyCon Uruguay 2013
Python Ecosystem for Beginners - PyCon Uruguay 2013Python Ecosystem for Beginners - PyCon Uruguay 2013
Python Ecosystem for Beginners - PyCon Uruguay 2013
 
Distributed Social Networking
Distributed Social NetworkingDistributed Social Networking
Distributed Social Networking
 
10 more-things-you-can-do-with-python
10 more-things-you-can-do-with-python10 more-things-you-can-do-with-python
10 more-things-you-can-do-with-python
 
Jeff mc cune sf 2010
Jeff mc cune sf 2010Jeff mc cune sf 2010
Jeff mc cune sf 2010
 
Advanced android
Advanced androidAdvanced android
Advanced android
 
HTML5: Building for a Faster Web
HTML5: Building for a Faster WebHTML5: Building for a Faster Web
HTML5: Building for a Faster Web
 
Los Angeles R users group - Nov 17 2010 - Part 2
Los Angeles R users group - Nov 17 2010 - Part 2Los Angeles R users group - Nov 17 2010 - Part 2
Los Angeles R users group - Nov 17 2010 - Part 2
 
Reef - ESUG 2010
Reef - ESUG 2010Reef - ESUG 2010
Reef - ESUG 2010
 
Edted 2010 Ruby on Rails
Edted 2010 Ruby on RailsEdted 2010 Ruby on Rails
Edted 2010 Ruby on Rails
 

More from Brian Hogan

Creating and Deploying Static Sites with Hugo
Creating and Deploying Static Sites with HugoCreating and Deploying Static Sites with Hugo
Creating and Deploying Static Sites with HugoBrian Hogan
 
Automating the Cloud with Terraform, and Ansible
Automating the Cloud with Terraform, and AnsibleAutomating the Cloud with Terraform, and Ansible
Automating the Cloud with Terraform, and AnsibleBrian Hogan
 
Create Development and Production Environments with Vagrant
Create Development and Production Environments with VagrantCreate Development and Production Environments with Vagrant
Create Development and Production Environments with VagrantBrian Hogan
 
Getting Started Contributing To Open Source
Getting Started Contributing To Open SourceGetting Started Contributing To Open Source
Getting Started Contributing To Open SourceBrian Hogan
 
Rethink Frontend Development With Elm
Rethink Frontend Development With ElmRethink Frontend Development With Elm
Rethink Frontend Development With ElmBrian Hogan
 
Testing Client-side Code with Jasmine and CoffeeScript
Testing Client-side Code with Jasmine and CoffeeScriptTesting Client-side Code with Jasmine and CoffeeScript
Testing Client-side Code with Jasmine and CoffeeScriptBrian Hogan
 
FUD-Free Accessibility for Web Developers - Also, Cake.
FUD-Free Accessibility for Web Developers - Also, Cake.FUD-Free Accessibility for Web Developers - Also, Cake.
FUD-Free Accessibility for Web Developers - Also, Cake.Brian Hogan
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web DesignBrian Hogan
 
Web Development with CoffeeScript and Sass
Web Development with CoffeeScript and SassWeb Development with CoffeeScript and Sass
Web Development with CoffeeScript and SassBrian Hogan
 
Building A Gem From Scratch
Building A Gem From ScratchBuilding A Gem From Scratch
Building A Gem From ScratchBrian Hogan
 
Intro To Advanced Ruby
Intro To Advanced RubyIntro To Advanced Ruby
Intro To Advanced RubyBrian Hogan
 
Turning Passion Into Words
Turning Passion Into WordsTurning Passion Into Words
Turning Passion Into WordsBrian Hogan
 
HTML5 and CSS3 Today
HTML5 and CSS3 TodayHTML5 and CSS3 Today
HTML5 and CSS3 TodayBrian Hogan
 
Stop Reinventing The Wheel - The Ruby Standard Library
Stop Reinventing The Wheel - The Ruby Standard LibraryStop Reinventing The Wheel - The Ruby Standard Library
Stop Reinventing The Wheel - The Ruby Standard LibraryBrian Hogan
 
Intro to Ruby - Twin Cities Code Camp 7
Intro to Ruby - Twin Cities Code Camp 7Intro to Ruby - Twin Cities Code Camp 7
Intro to Ruby - Twin Cities Code Camp 7Brian Hogan
 
Make GUI Apps with Shoes
Make GUI Apps with ShoesMake GUI Apps with Shoes
Make GUI Apps with ShoesBrian Hogan
 
Story-driven Testing
Story-driven TestingStory-driven Testing
Story-driven TestingBrian Hogan
 

More from Brian Hogan (20)

Creating and Deploying Static Sites with Hugo
Creating and Deploying Static Sites with HugoCreating and Deploying Static Sites with Hugo
Creating and Deploying Static Sites with Hugo
 
Automating the Cloud with Terraform, and Ansible
Automating the Cloud with Terraform, and AnsibleAutomating the Cloud with Terraform, and Ansible
Automating the Cloud with Terraform, and Ansible
 
Create Development and Production Environments with Vagrant
Create Development and Production Environments with VagrantCreate Development and Production Environments with Vagrant
Create Development and Production Environments with Vagrant
 
Docker
DockerDocker
Docker
 
Getting Started Contributing To Open Source
Getting Started Contributing To Open SourceGetting Started Contributing To Open Source
Getting Started Contributing To Open Source
 
Rethink Frontend Development With Elm
Rethink Frontend Development With ElmRethink Frontend Development With Elm
Rethink Frontend Development With Elm
 
Testing Client-side Code with Jasmine and CoffeeScript
Testing Client-side Code with Jasmine and CoffeeScriptTesting Client-side Code with Jasmine and CoffeeScript
Testing Client-side Code with Jasmine and CoffeeScript
 
FUD-Free Accessibility for Web Developers - Also, Cake.
FUD-Free Accessibility for Web Developers - Also, Cake.FUD-Free Accessibility for Web Developers - Also, Cake.
FUD-Free Accessibility for Web Developers - Also, Cake.
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Web Development with CoffeeScript and Sass
Web Development with CoffeeScript and SassWeb Development with CoffeeScript and Sass
Web Development with CoffeeScript and Sass
 
Building A Gem From Scratch
Building A Gem From ScratchBuilding A Gem From Scratch
Building A Gem From Scratch
 
Intro To Advanced Ruby
Intro To Advanced RubyIntro To Advanced Ruby
Intro To Advanced Ruby
 
Turning Passion Into Words
Turning Passion Into WordsTurning Passion Into Words
Turning Passion Into Words
 
HTML5 and CSS3 Today
HTML5 and CSS3 TodayHTML5 and CSS3 Today
HTML5 and CSS3 Today
 
Stop Reinventing The Wheel - The Ruby Standard Library
Stop Reinventing The Wheel - The Ruby Standard LibraryStop Reinventing The Wheel - The Ruby Standard Library
Stop Reinventing The Wheel - The Ruby Standard Library
 
Intro to Ruby
Intro to RubyIntro to Ruby
Intro to Ruby
 
Intro to Ruby - Twin Cities Code Camp 7
Intro to Ruby - Twin Cities Code Camp 7Intro to Ruby - Twin Cities Code Camp 7
Intro to Ruby - Twin Cities Code Camp 7
 
Make GUI Apps with Shoes
Make GUI Apps with ShoesMake GUI Apps with Shoes
Make GUI Apps with Shoes
 
The Why Of Ruby
The Why Of RubyThe Why Of Ruby
The Why Of Ruby
 
Story-driven Testing
Story-driven TestingStory-driven Testing
Story-driven Testing
 

Recently uploaded

What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfMounikaPolabathina
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Strongerpanagenda
 
Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptx
Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptxUse of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptx
Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptxLoriGlavin3
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
SALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICESSALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICESmohitsingh558521
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfpanagenda
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterMydbops
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Visualising and forecasting stocks using Dash
Visualising and forecasting stocks using DashVisualising and forecasting stocks using Dash
Visualising and forecasting stocks using Dashnarutouzumaki53779
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPathCommunity
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...Scott Andery
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningLars Bell
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 

Recently uploaded (20)

What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdf
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
 
Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptx
Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptxUse of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptx
Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptx
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
SALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICESSALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICES
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL Router
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Visualising and forecasting stocks using Dash
Visualising and forecasting stocks using DashVisualising and forecasting stocks using Dash
Visualising and forecasting stocks using Dash
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to Hero
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
 

Web Development With Ruby - From Simple To Complex

  • 1. 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
  • 2. Ruby developers have greatly influenced 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
  • 3. 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.
  • 4. 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
  • 5. 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
  • 6. 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.
  • 7. 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.
  • 8. 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.
  • 9. 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
  • 10. 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.
  • 11. 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.
  • 12. 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 find that you ramp up quickly.
  • 13. "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 find yourself guessing too much what methods are available to you.
  • 14. Arrays colors = ["Red", "Green", "Blue"] Sunday, October 10, 2010 14 The square brackets denote an array.
  • 15. Hashes (Dictionaries) attributes = {:age => 25, :first_name => "Homer", :last_name => "Simpson"} Sunday, October 10, 2010 15
  • 16. => Sunday, October 10, 2010 16 This is the hash symbol, or the hash rocket. Whenever you see this, you’re dealing with a hash.
  • 17. :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.
  • 18. Simple control logic if on_probation(start_date) puts "Yes" else puts "no" end Sunday, October 10, 2010 18
  • 19. 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.
  • 20. 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.
  • 21. 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.
  • 22. 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.
  • 23. haml and sass twitter: bphogan email: brianhogan at napcs.com Sunday, October 10, 2010 23
  • 24. 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
  • 25. 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
  • 26. 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
  • 27. 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
  • 28. $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
  • 29. Demos twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 29
  • 30. 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
  • 31. 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.
  • 32. Rake twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 32
  • 33. 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
  • 34. Rakefiles 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
  • 35. 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
  • 36. 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.
  • 37. 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
  • 38. 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.
  • 39. Sunday, October 10, 2010 39 That little bit of code gets us a working web application that handles requests.
  • 40. 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
  • 41. 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
  • 42. config.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
  • 43. 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
  • 44. cucumber Web application testing for people first 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
  • 45. 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
  • 46. 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
  • 47. 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
  • 48. Demo? twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 48
  • 49. 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
  • 50. 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
  • 51. 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
  • 52. EventMachine twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 52
  • 53. 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
  • 54. 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
  • 55. Opinionated, but flexible. twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 55
  • 56. Demo twitter: @bphogan email: brianhogan at napcs.com Like this talk? Rate it at http://spkr8.com/t/4773 Sunday, October 10, 2010 56
  • 57. “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.
  • 58. 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
  • 59. I am a “Web” developer first 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
  • 60. 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
  • 61. ...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
  • 62. 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
  • 63. 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

Editor's Notes

  1. We&amp;#x2019;re going to tlk about story-driven testing with Cucumber.
  2. Testing web apps can be frustrating because there are so many places where things can go wrong. Most developers test web sites by running users through the application, but the manual clicking can take time.
  3. Developers would rather be coding new features, and users would rather have a product that works well and not have their time wasted doing the developer&amp;#x2019;s job for them.
  4. We don&amp;#x2019;t do things that are hard and not fun. It&amp;#x2019;s just human nature. We just kind of hide and pretend they&amp;#x2019;re not problems.
  5. Unfortunately, this leads to shipping bad software.
  6. ...then the support calls come, and the angry emails, and the displeased shareholders.
  7. Obviously there has to be some kind of workable solution, but what is it?
  8. We can make the work easy by automating things. We spend so much time as developers automating processes for our clients that we never stop to think about how we might do that for ourselves and our processes.
  9. We can reduce some of our work if we can get the users involved in a real way.
  10. Finally, in order for this to work, management has to enforce testing practices. Applications have to be shipped with good test coverage, and time estimates must include the time it takes to write tests.
  11. Everyone knows testing isn&amp;#x2019;t a waste of time. We may argue on how to do it, but everyone does some level of testing as they develop.
  12. Unfortunately, every single developer can come up with a list of excuses why they don&amp;#x2019;t test enough. Usually they blame management or marketing for pushing deadlines.
  13. Management has to make deadlines or stuff doesn&amp;#x2019;t get done, and they have outside forces pressuring them to deliver results.
  14. Programmers know that if they rush, they&amp;#x2019;re going to do crappy work and while deadlines may be met in the short term, what is the cost of the technical debt incurred? Bad code needs to be addressed at some point. A professioal craftsman strives for quality.
  15. So we have to be able to test quickly and easily
  16. and we have to allow time to make it happen
  17. and we can achieve some of this with Cucumber, a testing framework designed with the user experience in mind.
  18. This scenario is written using Gherkin, Cucumber&amp;#x2019;s language for describing user interactions. It&amp;#x2019;s easy to read and easy to understand. You can sit down with your end users and write these scnearios together and then later use them to test your real application.
  19. When thinking about a feature, you and your user must think about what value the feature has.
  20. Ask yourselves &amp;#x201C;why do we need this feature? How will having this feature benefit a user?&amp;#x201D; The user might be a system administrator, a site owner, a basic user, or an anonymous guest, but you should only think about features that directly impact a user.
  21. A feature can best be described by filling in these blanks: &amp;#x201C;As a somebody, I want to do something, so that I can do something else. &amp;#x201C;
  22. &amp;#x201C;As a nervous student who may not graduate, I want to be able to check my grades in real time so that I know I will get a diploma&amp;#x201D; is definitely focused on the user.
  23. You describe a scenario using &amp;#x201C;given, when, then&amp;#x201D;.
  24. The scenario describes the feature in more details, explaining how a user will move through the application to achieve the feature&amp;#x2019;s goal.
  25. &amp;#x201C;Given&amp;#x201D; steps explain the prerequisites for the test. They let you specify any setup conditions that must have occurred outside of the process.
  26. Given I am logged in as &amp;#x201C;homer&amp;#x201D; And I am a current student And I am on the My Info page and I recived a grade of &amp;#x201C;C-&amp;#x201D; in &amp;#x201C;CS 462&amp;#x201D;
  27. &amp;#x201C;When&amp;#x201D; steps describe what you do during the scenario
  28. When I click &amp;#x201C;Check my grades And I select &amp;#x201C;Current Term&amp;#x201D; And I press &amp;#x201C;View&amp;#x201D;
  29. &amp;#x201C;Then&amp;#x201D; steps describe the outcome you expect.
  30. Then I should see &amp;#x201C;Grades for Homer Simpson&amp;#x201D; And I should see a table with &amp;#x201C;CS 462&amp;#x201D; in row 1, column 1 And I should see a table with &amp;#x201C;C-&amp;#x201D; in row 1 column 4
  31. Step definitions map these sentences to actual code.
  32. We use Ruby and regular expressions to process each line in the story.
  33. Even though we write these definitions in Ruby code, you can run Cucumber against anything that shows up in your browser, including Flash!
  34. One popular way to run Cucumber stories is with WEBRAT. It&amp;#x2019;s a library mainly used in Rails applications to run a Ruby-based browser.
  35. When you install webrat, you get a bunch of ready-made matchers for common tasks like finding items on a page, filling in forms, clicking links, and pressing buttons
  36. WATIR, or &amp;#x201C;Web Application Testing In Ruby&amp;#x201D; automates Internet Explorer or Firefox and works well with Cucumber.
  37. Steps are mapped by using regular expression capture values. The captured values can then be used in the step.
  38. You can use multiple parameters too.
  39. A small demo automating Pastie.
  40. So, stories automate a browser
  41. there are many more advanced features of Cucumber though.
  42. One major advantage of this is that your features stay with your code. They stay fresh, and they change as your code changes. A new developer can look at these features, run them, and know exactly what the application does.
  43. Your non-technical stakeholders, management, and other parties can easily communicate with the developers about features.
  44. If you can get features that are well thought out, well planned, and well communicated in front of your developers so they can implement them, you&amp;#x2019;ll be a hero.
  45. That&amp;#x2019;s how you win.