Rapid Web App Development in Ruby: Introduction

Photo by Divyadarshi Acharya on Unsplash

In this blog series, I will be covering how to create a web app using ruby with minimal effort. Assuming you have ruby installed let's get started.

I am going to use sinatra framework here, so first step is to install sinatra gem.

gem install sinatra

Now create a new folder to store your app files. Since I am going to create a simple search app which has contact information, naming it as contacts. Open this folder in your editor now. I am using visual studio code.

Create a file named app.rb with the following contents

# app.rb

require 'sinatra'

get '/' do
  'Welcome to contacts app!'
end

Now from your terminal, run ruby app.rb, you will see a similar message on your screen now.

slashpai@pai  ~/contacts   ruby app.rb

[2020-06-28 12:05:09] INFO  WEBrick 1.4.2
[2020-06-28 12:05:09] INFO  ruby 2.6.6 (2020-03-31) [x86_64-linux]
== Sinatra (v2.0.8.1) has taken the stage on 4567 for development with backup from WEBrick
[2020-06-28 12:05:09] INFO  WEBrick::HTTPServer#start: pid=21875 port=4567

From your browser, go to localhost:4567, you should see the content on web page as Welcome to contacts app!. That was easy right?

Now let's understand how it worked. When you typed localhost:4567 in your browser, it checked in app.rb file if route for this url is defined, since this is root of website, it will look for route with /. And that's what we have defined with get method in app.rb file.

In Sinatra, a route is an HTTP method paired with a URL pattern. Each route is associated with a block. Routes will be evaluated in the same order as they are defined. The first route that matched will be invoked.

Now let's add more routes in app.rb file and restart app using ruby app.rb

# app.rb

require 'sinatra'

get '/' do
  'Welcome to contacts app!'
end

get '/home' do
    'Home page'
end

get '/contacts' do
    'This page is under construction'
end

Now visit home and contacts pages. You should see same messages as defined in routes.

You might have noticed, you need to restart app.rb everytime you make a change. How we can simplify this?

We will use the gem 'sinatra-contrib' for this. Go ahead and install this gem now

gem install sinatra-contrib

Now in your app.rb file, require the following library which comes as part of sinatra-contrib gem

require 'sinatra/reloader'

Run your app now ruby app.rb. While the app is running make any changes to the route messages to verify auto reload is working. The site will display updated content without needing the app restart.

The complete app.rb file

# app.rb

require 'sinatra'
require 'sinatra/reloader'

get '/' do
  'Welcome to contacts app!'
end

get '/home' do
    'Home page'
end

get '/contacts' do
    'This page is under construction'
end

Hope that was helpful, we will see more on Sinatra web development in next post!