Send SMS and WhatsApp messages with Twilio

Send SMS and WhatsApp messages

In this article:

What is Twilio?
Benefits of using Twilio in React Flow
How to connect Twilio to React Flow
Send SMS action
Send WatsApp message action

✔️ What is Twilio?

Twilio - a communication service that provides automatically generated phone numbers that you can use in your business to communicate with customers.

✔️ Benefits of using Twilio in React Flow

React Flow provides several communication channels with customers: email, SMS, and WhatsApp. Private messages are one of the most comfortable and fastest communication channels. Therefore, in order to provide our customers with the ability to send SMS, we have chosen the Twilio service.

New communication channels. People usually respond faster to SMS so we decided to expand the number of communication channels with customers. Now you can communicate with customers via SMS and WhatsApp messages.
Easy to integrate. To connect Twilio and React Flow you need just to register in the Twilio service and copy the appropriate data to the React Flow. After setting up and connecting to Twilio, you will immediately have access to actions for sending SMS and WhatsApp messages.
High-quality connections. According to the SLA (Service Level Agreement), Twilio’s software is rated as 99,95%. That means that the connection quality of the service is good and your messages will reach the addressee on time.
User security. Personal data security is always our priority. We guarantee the security of the data you use in the application. Twilio also protects users' data securely and provides two-factor authorization.

✔️ How to connect Twilio to React Flow?

Twilio - Generate phone number for SMS

To connect Twilio to React Flow you need to have an account in the Twilio service. If you have account, log in and skip this step. If you don’t have it, sign up the Twilio.

Log in to your account. On the admin panel you will get Account SID and Auth Token.

Click on Get a Twilio phone number and the service will automatically generated you a phone number. You will need this data in React Flow.

Note: In the React Flow you can only use the numbers you entered in Twilio.

Twilio - Connect WhatsApp

If you want to register a number for brand, you should follow the instruction from the article WhatsApp Self Sign-up.

If you want to register a number not for brand, you must fill out Twilio’s Request Access form. You need to provide the requested information and wait for confirmation from Twilio. Please review the Getting Started guide for details.

React Flow - Create connector

Open the React Flow app and go to the Connectors tab and click on Twilio connector.

Step 1. (optional) Enter the name and description of the connector.

Step 2. In your Twilio account copy Account SID and Auth Token and enter them in the appropriate fields in React Flow.

Step 3. In the upper right corner, you can find the Test button - it is designed to check if the connector works correctly. Click on it and enter a phone number generated by Twilio and a test phone number where you will send a test message. You will get SMS with confirmation.

Step 4. Click Save on the upper right corner

Now, if you go to the Connectors, you will see that Twilio connector’s status is connected. As soon as you have connected the Twilio, two actions become available to you in the React Flow application: Send SMS and Send WatsApp message actions.

✔️ Send SMS action

Send SMS action allows you automatically send SMS to your customer.

Example: You want to send a confirmation SMS to customers every time when they paid their order.

Open the React Flow app and click on Create new.
Select trigger Order paid.
Click on Add action and in the right side menu select Send SMS.
Find the Recipient’s phone filed and click on Add variables.

Select the variable Customer phone and enter your message in the message field.

Save changes.

Now, when your customer will complete payment, he will receive a confirmation via SMS.

✔️ Send WhatsApp message action

Send WhatsApp message action allows you automatically send messages to your customer via WhatsApp.

Example: You want to provide a discount as a welcome bonus for registered customers.

Open the React Flow app and click on Create new.
Select trigger Customer created.
Click on Add action and in the right side menu select Send WhatsApp message.

Find the Recipient’s phone filed and click on Add variables.
Select the variable Customer phone and enter your message in the message field.

Save changes.

Now, the buyer will receive a message with a discount immediately after registration.