| Config Value | Description |
|---|---|
| Account SID | Your primary Twilio account identifier - find this in the console here. |
| Auth Token | Used to authenticate - just like the above, you'll find this here. |
| TwiML App SID | The TwiML application with a voice URL configured to access your server running this app - create one in the console here. Also, you will need to configure the Voice "REQUEST URL" on the TwiML app once you've got your server up and running. |
| Twilio Phone | A Twilio phone number in E.164 format - you can get one here |
-
Clone this repo using
git clone --depth=1 [email protected]:luis-teixeira/react-twilio-webphone.git -
Run
npm installto install dependencies. -
Edit
server/twilio/config.jswith the four configuration parameters we gathered from above. -
At this point you can run
npm start:tunnel. -
When ngrok starts up, it will assign a unique URL to your tunnel. It might be something like https://asdf456.ngrok.io. Take note of this.
-
Configure your TwiML app's Voice "REQUEST URL" to be your ngrok URL plus
twilio/voice. For example:
You should now be ready to rock! Make some phone calls. Open it on another device and call yourself. Note that Twilio Client requires WebRTC enabled browsers, so Edge and Internet Explorer will not work for testing. We'd recommend Google Chrome or Mozilla Firefox instead.