This course will become read-only in the near future. Tell us at if that is a problem.

Exercise 4

Ruby web apps with Sinatra


Sinatra is a DSL (domain specific language) for creating web applications.  This sounds complicated, but what it boils down to is that Sinatra has methods that read almost like English that make it easy to create a web app.


Installing Sinatra is easy.  At the command line, run:

gem install sinatra

Sample Web Application

For instance, create a Ruby script named webapp.rb with the following contents

require 'sinatra'

get '/' do
  "Hello world!"

Save the file and at the command line, run:

ruby webapp.rb

If all went well, you should see output similar to:

== Sinatra/1.2.6 has taken the stage on 4567 for development with backup from WEBrick
[2011-05-26 07:29:49] INFO  WEBrick 1.3.1
[2011-05-26 07:29:49] INFO  ruby 1.9.2 (2011-02-18) [x86_64-linux]
[2011-05-26 07:29:49] INFO  WEBrick::HTTPServer#start: pid=2644 port=4567

Take note of the "port=XXXX" portion.  In this case, since it reads 4567, the web application is available at http://localhost:4567/  Using a browser, navigate to that URL.  You should see "Hello World!"

Further Reading

A full introduction to Sinatra is available at the Sinatra website.  I encourage you to read over that document, even if some of it does not make sense because it assumes some knowledge of web development.  Do focus on the parts you can understand at this point.  The exercise below will only require a basic knowledge.


Create a simple web application that manages a TODO list.  The web application should respond to the following routes:

http://localhost:4567/                    - display the TODO list
http://localhost:4567/add/wash+the+dog    - adds "wash the dog" as a TODO list item (notice spaces need to be escaped as plus signs in URLs)
http://localhost:4567/remove/wash+the+dog - removes "wash the dog" as a TODO list item

Since this may be a bit overwhelming, I've given you a skeleton program below and some hints.  Copy this program into your git repository, finish it up, and commit it.

require 'sinatra'

# Remember arrays?  We'll store the TODO list in an array
items = []

get '/' do
  # To iterate through an array, use the #each method (look back at LtP Chapter 7)
  # Note that "puts" in Sinatra will only output to the console, not the web
  # browser.  Instead, build up a string called "response" and return it to
  # Sinatra so that will be the response

  response = ""
  items.each do |item|
    # TODO: Build up the response string by concatenating "item" and a line
    # break "<br/>" to the string

  # Keep the line here so that response is returned to sinatra

get '/add/:item' do
  # The new item will be available as params[:item]
  # TODO: Insert code to add params[:item] to the global items array here

  redirect to('/')

get '/remove/:item' do
  # The item to be removed will be available as params[:item]
  # TODO: Insert code to remove params[:item] from the global items array
  # here.  You may want to use a method called Array#delete (look it up in the
  # documentation!)

  redirect to('/')