Set up your Ruby and Sinatra development environment

Before you begin this tutorial, configure, acquire, and install the following:

• Administrative access to your computer to install software
• A stable internet connection for downloading packages and dependencies
• Basic familiarity with using the Command Prompt or terminal.
• A Twilio account (free tier available)
• A Twilio phone number with voice capabilities (you can get one for free when you sign up for a Twilio account). For more information on setting up your Twilio phone number, check out the Twilio Voice Quickstart.
• Ruby 2.6 or later
• ngrok
• Visual Studio Code to write Ruby code. Though any text editor or IDE works, this tutorial provides examples and command for VS Code.

Using VS Code, create a directory and configure your Sinatra settings for your app:

1. Open VS Code.

2. To open the terminal in VS Code, go to View > Terminal.

3. Create a directory for your project.

   Copy code block

   1
   mkdir my-twilio-project
   2
   cd my-twilio-project
   3
   code .

4. Install the required gems:

   Copy code block

   gem install sinatra rackup puma twilio-ruby

To create a Twilio app using Sinatra, create Ruby file, run it with Sinatra, and verify its response in a browser:

1. Add a file called index.rb to your workspace.

2. with the following code:

   index.rb

   Copy code block

   1
   require 'rack'
   2
   require 'rack/handler/puma'
   3
   require 'twilio-ruby'
   4
   
   5
   puts "Sinatra server starting..." # This confirms that the server is running.
   6
   
   7
   class BasicApp
   8
     def call(env)
   9
       if env['REQUEST_METHOD'] == 'GET' && env['PATH_INFO'] == '/'
   10
         twiml = Twilio::TwiML::VoiceResponse.new do |response|
   11
           response.say(message: 'Hello World')
   12
         end
   13
         [200, {'Content-Type' => 'text/xml'}, [twiml.to_s]]
   14
       else
   15
         [404, {'Content-Type' => 'text/plain'}, ['Not Found']]
   16
       end
   17
     end
   18
   end
   19
   
   20
   options = {
   21
     Host: '0.0.0.0',
   22
     Port: 4567
   23
   }
   24
   Rack::Handler::Puma.run(BasicApp.new, **options)
   25
   # This line of code bypasses Sinatra's protection middleware which allows external requests.

3. Save this file in your workspace.

4. Run your Twilio Voice web app in the terminal.

   Copy code block

   ruby index.rb &

5. Open your browser to http://localhost:4567. The browser should display:

   Copy code block

   <?xml version="1.0" encoding="UTF-8"?><Response><Say>Hello World</Say></Response>

   This verifies the proper configuration of your Ruby and Sinatra development environment and that you can access your app on your local system.

Web applications launched from your computer can't be accessed outside your computer. To communicate with your app, most Twilio services use webhooks.

For example: When Twilio receives an incoming phone call, it requests a URL in your app for instructions on how to handle the call.

To allow webhooks from Twilio to access your application, use ngrok.

1. Start your app as described previously.

2. Start ngrok with the following options:

   Copy code block

   ngrok http 4567

   Terminal output resembles the following:

   Copy code block

   1
   ngrok by @inconshreveable
   2
   
   3
   Tunnel Status  online
   4
   Version        3.x.x
   5
   Region         us
   6
   Web Interface  http://127.0.0.1:4040
   7
   Forwarding     http://<random_subdomain>.ngrok.io -> http://localhost:4567
   8
   Forwarding     https://<random_subdomain>.ngrok.io -> http://localhost:4567
   9
      Connections    ttl     opn     rt1     rt5     p50     p90
   10
                     0       0       0.00    0.00    0.00    0.00

3. A successful ngrok configuration results in your Twilio Voice app returning the following XML at your ngrok URL:

   Copy code block

   <?xml version="1.0" encoding="UTF-8"?><Response><Say>Hello World</Say></Response>

Learn more about Twilio and Sinatra with the following resources:

• SMS developer quickstart
• WhatsApp Business Platform with Twilio quickstart
• Programmable Voice quickstart
• Email API Quickstart for Ruby

• Sinatra: Getting started
• Sinatra: API reference