Creating a basic Sinatra Project

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 Gemfile

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'

Write basic service

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.

Starting up your server: Using the command line prompt

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:

  • Type cd (note the space after cd) into the Window
  • From either your text editor or from the file explorer window, drag the ruby file onto the command line window.
  • This will add the full path to the file including the code file.
  • Backspace to delete the file name.
  • Press Enter

You should now be switched into the right directory.

Install Bundler

First we need to install bundler. You’ll only need to do this once.

gem install bundler

Run this application

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!

What’s happening here?

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:

  • The type of HTTP Request (in the example above you’ll notice it’s a ‘GET’ request)
  • The endpoint that we want to map to an action: That the bit in the ‘/’ - and in this case we’re telling it to map the root domain to an action i.e. if nothing but the URL is typed in the browser, what should our program return.
  • The action: this is what to do in response to the request. We use a block of code starting with do and finishing with end to contain the code.
  • The response: Typically the last line of the block is what’s returned back as part of the request. In this case we’re returning a string that says “Hello World”
×

Subscribe

The latest tutorials sent straight to your inbox.