Building Web Apps with Rack and Sinatra

Project files and notes at www.blacktm.com

Transcript

1. Building Web Apps
   with Rack and Sinatra
   @blacktm
   

   View Slide

2. Objectives
   ✔ Describe the HTTP request process
   ✔ Define Rack, describe its purpose
   ✔ Build a simple Rack web app
   ✔ Define, build, and use middleware
   ✔ Define DSL (compare with “framework”)
   ✔ Build a simple Sinatra app
   

   View Slide

3. Things You’ll Need
   ✔ gem install thin
   ✔ gem install sinatra
   ✔ gem install heroku
   ✔ Project files and notes at
   blacktm.com
   

   View Slide

4. HTML
   CSS
   JS
   Rails / Sinatra
   Ruby
   Deploy
   

   View Slide

5. Web Server
   HTTP Request
   Middleware
   Rack
   Your App
   

   View Slide

6. Web Server
   HTTP Request
   Middleware
   Rack
   Your App
   

   View Slide

7. What is Rack?
   A modular web server interface.
   (Connects your Ruby app to the web.)
   

   View Slide

8. View Slide

9. A common interface.
   

   View Slide

10. Your App
    Rack
    Thin
    WEBrick
    Mongrel
    CGI
    

    View Slide

11. What is a Rack app?
    A Ruby object that responds to a “call”
    method, taking a single hash parameter,
    and returning an array which contains the
    response status code, response headers,
    and response body as an array of strings.
    “In English, please.”
    

    View Slide

12. $ rackup config.ru
    Run it!
    Open “simple_rack” and edit the “config.ru” file.
    # config.ru - rackup file
    require 'rack'
    class MyApp
    def call(env)
    headers = { "Content-Type" => "text/html" }
    [200, headers, ["Hello world!"]]
    end
    end
    run MyApp.new
    

    View Slide

13. http://0.0.0.0:9292
    #=> Hello world!
    http://0.0.0.0:9292/there/isnt/a/route/here
    #=> Hello world!
    A very basic server.
    

    View Slide

14. Who cares?
    ✔ You just built a web app. Damn.
    ✔ Important in understanding (and
    building) web frameworks (e.g. Rails)
    ✔ Middleware!
    

    View Slide

15. HTTP Request
    Middleware
    Rack
    Your App
    Web Server
    

    View Slide

16. HTTP Request
    Middleware
    Rack
    Your App
    Web Server
    

    View Slide

17. Let’s explore Middleware!
    1. Open “rack_middleware”
    2. Stop the server (ctrl-c)
    3. Run: $ rackup config.ru
    4. Open: http://0.0.0.0:9292
    or: http://localhost:9292
    

    View Slide

18. View Slide

19. Rack’s Default Middleware
    (in development mode):
    Rack::CommonLogger
    Rack::ShowExceptions
    Rack::Lint
    

    View Slide

20. # app.rb
    class MyApp
    def call(env)
    puts "Hello from MyAPP"
    return [200, {}, ["Hello"]]
    end
    end
    No “Content-Type”
    

    View Slide

21. Solution?
    Middleware!
    

    View Slide

22. class ContentType
    def initialize(app)
    @app = app
    end
    def call(env)
    status, headers, body = @app.call(env)
    puts "Hello from ContentType"
    # TODO: Add "Content-Type" to the HTTP
    # headers and return the response.
    end
    end
    Open “config.ru”
    

    View Slide

23. Add the “Content-Type” to the headers.
    # TODO: Add "Content-Type" to the HTTP
    # headers and return the response.
    headers.merge!( "Content-Type" => "text/html" )
    return [status, headers, body]
    

    View Slide

24. class FinishSentence
    def initialize(app)
    @app = app
    end
    def call(env)
    status, headers, body = @app.call(env)
    puts "Hello from FinishSentence"
    # TODO: Add " world!" to the HTTP
    # body and return the response.
    end
    end
    

    View Slide

25. Add the “ world!” to the body.
    # TODO: Add " world!" to the HTTP
    # body and return the response.
    body.push(" world!")
    return [status, headers, body]
    

    View Slide

26. Use the middleware.
    # TODO: Tell the app to use the "ContentType"
    # and "FinishSentence" middleware.
    use ContentType
    use FinishSentence
    

    View Slide

27. Run it!
    $ rackup config.ru
    http://0.0.0.0:9292
    127.0.0.1 - - [13/Oct/2012 21:18:58] "GET / HTTP/1.1" 200 12 0.0009
    

    View Slide

28. rack_middleware:$ rackup config.ru
    >> Thin web server (v1.5.0 codename Knife)
    >> Maximum connections set to 1024
    >> Listening on 0.0.0.0:9292, CTRL+C to stop
    Hello from MyAPP
    Hello from FinishSentence
    Hello from ContentType
    127.0.0.1 - - [14/Nov/2012 17:01:07] "GET / HT
    {
    

    View Slide

29. What’s wrong with this?
    

    View Slide

30. What’s wrong with this?
    

    View Slide

31. View Slide

32. View Slide

33. “Sinatra is a DSL for quickly creating web
    applications in Ruby with minimal e ort.”
    A “human interface” to Rack.
    “Domain Specific Language”
    

    View Slide

34. View Slide

35. HTTP Request
    Middleware
    Rack
    Your App
    Web Server
    

    View Slide

36. HTTP Request
    Middleware
    Rack
    Your App
    Web Server
    

    View Slide

37. HTTP Request
    Middleware
    Rack
    Your App
    Sinatra
    Web Server
    

    View Slide

38. The Showdown
    Plain ‘ol Rack
    Sinatra
    get '/' do
    "Hello world!"
    end
    class MyApp
    def call(env)
    headers = { "Content-Type" => "text/html" }
    [200, headers, ["Hello world!"]]
    end
    end
    

    View Slide

39. $ rackup config.ru
    Run it!
    Open “simple_sinatra” and edit the “config.ru” file.
    # config.ru
    require 'sinatra'
    get '/' do
    "Hello Sinatra!"
    end
    run Sinatra::Application
    

    View Slide

40. What else can do?
    

    View Slide

41. # config.ru
    require 'sinatra'
    get '/' do
    "Hello Sinatra!"
    end
    get '/hello/:name' do |n|
    "Hello #{n}!"
    end
    get '/wildcard/*' do
    request.inspect
    end
    error 404 do
    "OMG, 404!"
    end
    get '/breakit' do
    500
    end
    run Sinatra::Application
    

    View Slide

42. View Slide

43. Rails
    email
    database
    ajax
    orm
    csrf
    routes
    tests
    sessions
    models
    views
    controllers
    “A full-stack web application framework.”
    logging
    tasks
    

    View Slide

44. Middleware
    Rack
    Your App
    Rails
    Web Server
    Middleware
    Rack
    Your App
    Sinatra
    Web Server
    

    View Slide

45. Middleware
    Rack
    Your App
    Web Server
    Middleware
    Rack
    Your App
    Sinatra
    Web Server
    RAILS
    

    View Slide

46. View Slide

47. View Slide

48. View Slide

49. View Slide

50. me
    

    View Slide

51. View Slide

52. View Slide

53. View Slide

54. Rack + Sinatra + DataMapper + Heroku
    Messages App
    

    View Slide

55. Thanks!
    @blacktm
    

    View Slide