Level up your Twilio API skills in TwilioQuest, an educational game for Mac, Windows, and Linux. Download Now
Build the future of communications.
Start building for free
  • By Phil Nash
    Build a location-aware WhatsApp weather bot with Ruby, Sinatra and Twilio Build a location-aware WhatsApp bot with Ruby, Sinatra and Twilio

    We've seen how to write a text chatbot using the Twilio API for WhatsApp using Ruby, but WhatsApp also supports sending and receiving location data via their API. In this post we are going to see how to build a WhatsApp bot that can receive and respond to location messages.

    We'll build a weather bot so that you can send your location to the bot to get your local weather forecast.

    What you'll need

    To code along with this post and build your own location-aware WhatsApp bot you will need:

    Configure …

    Read More
  • By Phil Nash
    Build a WhatsApp chatbot with Ruby, Sinatra and Twilio Build a WhatsApp chatbot with Ruby, Sinatra and Twilio

    Chatbots are programs that communicate some way with humans. They can be very basic, responding to keywords or phrases, or use something like Twilio Autopilot to take advantage of natural language understanding (NLU) to provide a richer experience and build out more complicated conversations.

    In this tutorial we are going to see how easy it is to get started building chatbots for WhatsApp using the Twilio API for WhatsApp and the Ruby web framework Sinatra. Here's an example of the conversation we're going to build:

    Using the bot inside the WhatsApp application. First we ask for cats and get a cat picture and fact. Then we ask for dogs and get a dog picture and fact. Finally we ask the bot if it can do anything else and it says it only knows about dogs and cats.

    What you'll need

    To build your own WhatsApp bot along with this tutorial, you will need the following:

    Read More
  • By Phil Nash
    Speech to text in the browser with the Web Speech API Speech to text in the browser with the Web Speech API

    The Web Speech API has two functions, speech synthesis, otherwise known as text to speech, and speech recognition, or speech to text. We previously investigated text to speech so let's take a look at how browsers handle recognising and transcribing speech with the SpeechRecognition API.

    Being able to take voice commands from users means you can create more immersive interfaces and users like using their voice. In 2018, Google reported that 27% of the global online population is using voice search on mobile. With speech recognition in the browser you can enable users to speak to your site across everything from a voice search to creating an interactive bot as part of the application.

    Let's see how the API works and what we can build with it.

    What you'll need

    We're going to build an example app to experience the API, if you want to build along …

    Read More
  • By Phil Nash
    HTML attributes to improve your users' two factor authentication experience HTML attributes to improve your users' two factor authentication experience

    There are plenty of opportunities for friction in the user experience when logging in, particularly while entering a two factor authentication code. As developers we should be building applications that support the need for account security but don't detract from the user experience. Sometimes it can feel as though these requirements are in a battle against each other.

    In this post we will look at the humble <input> element and the HTML attributes that will help speed up our users' two factor authentication experience.

    The default experience

    When you implement two factor authentication for a web application, perhaps with the Authy two factor authentication API, you will need a form for your user to input the one time password you are going to send them. You might create something similar to the following HTML:

    <form action="/sessions/check-2fa" method="POST">
      <div>
        <label for …
    Read More
  • By Phil Nash
    Send and track faxes with the Twilio Fax API using Sinatra and Ruby Send and track faxes with the Twilio Fax API using Sinatra and Ruby

    It happened! I've been waiting for the moment I needed to send a fax since Twilio launched the Programmable Fax API back in 2017 and this week it finally happened! I won't go into detail about what I needed to send, but it's safe to say the medical profession could consider their communication choices for the future.

    I could have sent the fax by uploading a PDF to Twilio Assets and using the API explorer, but that wouldn't have been as fun as over-engineering an entire application to send and track the fax to make sure it arrived and be prepared for any future fax situations.

    In this post I'll share how to build an application for sending and tracking faxes, but if you have faxes to send and want to jump straight into using it, you can find all the source code on GitHub.

    Weapons of choice …

    Read More
  • By Phil Nash
    Track email statuses in Ruby on Rails with SendGrid Track email statuses in Ruby on Rails with SendGrid

    When your application sends emails it is useful to know what happens to those emails, like whether it has been delivered or opened. Or, sometimes more importantly, whether it bounced. The Twilio SendGrid email API doesn't just send emails, it can also send you events via webhook that tell you what happened to your emails.

    In this post we'll build a small application using Ruby on Rails to send emails and update their status based on the Twilio SendGrid event webhooks.

    What you'll need

    In order to build this application along with this post, you will need:

    If you have all of that, then you're ready to get building.

    Preparing the example application

    I …

    Read More
  • By Phil Nash
    Build a Video Chat with React Hooks Build a Video Chat with React Hooks

    We've seen a video chat built in React on this blog before but since then, in version 16.8, React released Hooks. Hooks let you use state or other React features inside functional components instead of writing a class component.

    In this post we are going to build a video chat application using Twilio Video and React with only functional components, using the useState, useCallback, useEffect and useRef hooks.

    What you'll need

    To build this video chat application you will need the following:

    Once you've got all that, we can prepare our development environment.

    Getting started

    So we can get straight to the React application, we can start with the React and Express starter app I created. Download or clone the starter app's "twilio" branch, change into the new directory and …

    Read More
  • By Phil Nash
    Text to speech in the browser with the Web Speech API speech-synth-header.png

    The Web Speech API has two functions, speech synthesis, otherwise known as text to speech, and speech recognition. With the SpeechSynthesis API we can command the browser to read out any text in a number of different voices.

    From a vocal alerts in an application to bringing an Autopilot powered chatbot to life on your website, the Web Speech API has a lot of potential for web interfaces. Follow on to find out how to get your web application speaking back to you.

    What you'll need

    If you want to build this application as we learn about the SpeechSynthesis API then you'll need a couple of things:

    Once you're ready, create a directory to work in and download this HTML file and this CSS file to it. Make …

    Read More
  • By Phil Nash
    An introduction to the MediaRecorder API Copy of Photo blog Header 1-2.png

    On the web we can capture media streams from the user's camera, microphone and even desktop. We can use those media streams for real time video chat over WebRTC and with the MediaRecorder API we can also record and save audio or video from our users directly in a web browser.

    To explore the MediaRecorder API let's build a simple audio recorder app with just HTML, CSS and JavaScript.

    Getting started

    To build this application all we need is a text editor and a browser that supports the MediaRecorded API. At the time of writing, supported browsers include Firefox, Chrome and Opera. There is also work ongoing to bring this API to Edge and Safari.

    To get started, create a folder to work in and save this HTML file and this CSS file to give us something to start with. Make sure they are in the same folder …

    Read More
  • By Phil Nash
    Serverless Ruby on AWS Lambda with the Jets framework oMX1dI2w2BskhPm3NagdjbXVb0t9ONMEUOR_7ms5C51r_dW_1mNwj0Y7CYGhu6rlqef7HZr_rh659ECtBuVzqJyqEP5UuHfp6y9JGjCs53qLxeSq0hcbwxyZQZxV4L1dHiaMuBY

    When AWS launched Lambda in 2014 there was no love for Ruby. Platforms like Python, Node.js, and Java started the serverless revolution for hosting and running functions in the cloud. At the end of 2018, support for Ruby was finally launched.

    You can build with Ruby on Lambda using raw functions and Serverless Application Model (SAM) templates as described in the getting started guide for Ruby on Lambda, but Ruby is all about developer happiness and when the config file is longer than your program the process could be described as painful. Enter the Jets framework a framework that "leverages the power of Ruby to make serverless joyful for everyone."

    From Rails to Jets

    Jets combines the experience of building a Rails application with the ability to deploy to AWS Lambda and related services, including API Gateway, S3, and DynamoDB. In this post we're going to …

    Read More
  • Newer
    Older
    Sign up and start building
    Not ready yet? Talk to an expert.