Text messaging is the latest trend in e-commerce sites. It enables you to directly talk with your consumer and share new products or shipping updates. Twilio is a great tool that enables us as developers to add text messaging to our apps with minimal headaches. At Corvid by Wix, we’re all about increasing dev velocity, so with Twilio’s npm module, we can add text messaging to our website in less than 10 minutes. Don’t believe me? Let’s take a look.

The first thing you need to do is sign up for a Twilio trial account. This is free, and it will provide you with 3 crucial details: your account SID, your auth token, and your Twilio phone number. While you are there, it’s a good idea to also add your phone number as a verified number as free trial accounts can only send to numbers on Twilio’s verified list.

Now let’s open up Corvid by Wix. If you don’t already have a Wix site, it’s easy to get started. All you need to do is sign up for a free Wix account, create a site from a template (or blank if you prefer!), and enable Corvid. To enable Corvid, in your Wix Editor, select Dev Mode from the top menu bar and Turn on Dev Mode.

Add a button to your site from the (+) icon. This button will be how to initialize the Twilio text message. Add an onClick event to this button through the properties panel. When you click on a UI Element on the page, the properties pane loads with the details of that element. Go to the Events section, click the (+) next to onClick, and then hit Enter. You’ll see a new stubbed out onClick event listener in your code editor.

Inside the new onClick_ event listener_, let’s add a new function call to sendSMS().

export function smsButton_click(event) {
    sendSms(); 
}

Now the sendSms() function has to come from somewhere, so let’s have it come from the backend code so no one can get access to our secrets. To do this in Corvid, all you have to do is import the function from the backend code at the top of the UI code editor like so:

import {sendSms} from 'backend/twilio';

#javascript #web developement #npm #corvid #twilio sms #programming