1. Creating a basic Sinatra Project
Building your first basic Sinatra project
Guides, tutorials and labs to accompany CMU's Programming for Online Prototypes (49-714).
Everything you need to know about building microservices for the web with Ruby and Sinatra.
Now that we have Ruby, it’s time to create the project. Create the folder wherever you want on your computer.
You can do this in the command line / terminal window, or create a new folder as you would in any folder.
mkdir my_app
Note: Generally your project folders should be kept in a folder that isn’t likely to move. This is because later we’ll add them to a GitHub repository - if your folder moves, it gets really messy for GitHub to find that project and keep it in sync. Simply put, you don’t want to collect a lot of project folders on your Desktop.
We are going to start with the bare minimum to run our application.
Create a file called Gemfile
(important: don’t add an extension to the filename). And add the following contents:
source 'https://rubygems.org'
gem 'sinatra'
gem 'sinatra-contrib'
gem 'json'
In that folder we need to create a file where all of the code will live. It’s generally a good idea to either name it app.rb
(note the rb, or something similar)
in our application file… we’ll do something like this…
# app.rb
require 'sinatra'
require "sinatra/reloader" if development?
get '/' do
"Hello world!"
end
And that’s literally all you need for the simplest web server.
To do this, first, open a command line window.
If you’re on Windows 10: Tap or click the Start
button, followed by All apps. Find the Windows System
folder from the list of apps and tap or click it. Under the Windows System folder, click or tap Command Prompt
. Alternatively, search for ‘Command Prompt in the Start menu.
If you’re on Mac OSX: Open the Applications
directory. Scroll down to a sub-folder named Utilities
. Click on Terminal.app
. Alternatively, use Spotlight and search for Terminal
to launch it quickly.
A new window should open.
In order to run your ruby program, you need to be in the same directory. By default, both Terminal and Window’s Command Prompt will open in your default user directory. To change directory, we use a command called cd
then we need to tell the command prompt to navigate to that folder e.g. /Users/my-username/ruby-code/first-assignment
A quick way to do this is as follows:
cd
(note the space after cd) into the WindowEnter
You should now be switched into the right directory.
First we need to install bundler. You’ll only need to do this once.
gem install bundler
Run your app by typing the following at the commmand line (in Terminal on OSX or in Windows in the Command Prompt)
ruby app.rb
And Sinatra will start up a default WEBrick server (just like Rails) on port 4567. Navigate to http://localhost:4567
now and you’ll see a blank screen. If you use your browser to navigate there, you won’t see anything, but you can look at your server logs to see the ‘hello world’ response.
Congratulations - you just created a simple web service.
It doesn’t do much right now, but we’ll start to add more to it and make it do real stuff soon!
Our applicatication is bare bones but it does show the key elements of a Sinatra application.
At the top of our application file, we’re telling our program what gems we want to use. These statements always appear at the top of our file - our program needs to know them before anything else happens. This instruction require 'something'
tells it what functionality we need to do the things we want. And as you see in the example above, we definitely want to use sinatra in our Ruby program to do all sorts of awesome web stuff.
The other major part of our application is the routing.
When we open a browser window and type a URL into the window, in the background the browser is making a HTTP Request to the URL Provided. This request includes a domain (something like cmu.edu or google.com) and an endpoint (a path to the resource we want to access). The domain tells us where the information we want is hosted on the web - we can pin point a server that it resides on. The endpoint tells us and the server want we want to get at.
The way sinatra works, is to allow us to map these requests onto actions. We need to tell it a few things for this to happen:
do
and finishing with end
to contain the code.This series guides you through creating your first Sinatra project and some of the features it offers for creating web-delivered apps
Building your first basic Sinatra project
Building your first basic Sinatra project
Routing with HTTP Methods explained
How to include named parameters in defined routes
Storing User Information in Sessions
How to return a HTTP error response
Using configuration blocks to store application wide variables