A Frontline app cannot co-exist with a Flex app in the same Twilio Project. If you want to run both Flex and Frontline, you'll need to create separate Twilio projects for each.
Twilio Frontline is a mobile-first programmable omni-channel communication application that allows deskless employees to securely connect with customers, anywhere at any time.
This Frontline Quickstart uses Twilio Functions, a serverless environment, to host a pre-built backend integration service in Node.js, which connects to the Frontline interface and implementes core features of routing and connecting contact data on your Twilio account.
In this Quickstart, you will:
Sign up for or login to a Twilio account that has an SMS-enabled phone number
Create a new Frontline instance on your account
Configure Twilio Conversations
Configure Single Sign-On (SSO) so you can log in to the app securely
Quick Deploy of the Frontline Integration Service using CodeExchange
If you’d like to integrate Voice functionality into your Frontline Mobile Application, you will need to have a Twilio phone number with voice capabilities and configure the Voice calling functionality in the Frontline Console.
First, purchase an SMS-capable phone number. After navigating to the Buy a Number page in the Twilio Console, make sure the SMS box is selected, then click Search.
You'll then see a list of available phone numbers and their capabilities. Find a number of your choice and click Buy to add it to your account.
Before adding Frontline, let’s make sure your Twilio account is part of an Organization (this is a requirement for Frontline). To verify, please refer to the Organizations documentation.
If your account is not part of an organization yet, click Create an Organization in the Twilio Console. Fill out the form and click the Create Organization button.
Now that you have a Twilio account, an SMS-capable phone number, and your account is part of an Organization, you're all set to create a Twilio Frontline instance on your account!
Navigate to the Frontline section of the Twilio Console and click on the Create Frontline service button. If you don't see Frontline listed in your Twilio Console, go to Explore Products and under the Solutions section select Frontline. Click on the pin icon to keep Frontline on your sidebar navigation.
You'll see a pop-up that asks if you want to set Frontline services as your default Conversation service. Select the checkbox and then click the Confirm button.
Now that you've created a new Frontline instance, let's configure Twilio Conversations with the phone number you selected earlier. For these steps, you'll be navigating between the Conversations and the Programmable Messaging sections of the Twilio Console.
From the Configure Default Conversation Service dropdown menu, ensure Frontline Service is selected.
Unlock the "Handle Inbound Messages with Conversations" feature with the toggle button. Importantly, click the Save button to apply the new settings!
After that, click on the View Service button next to the Default Messaging Service dropdown menu to navigate to the Default Messaging Service configuration page.
Under the Programmable Messaging > Default Messaging Service for Conversations page, follow these steps:
Click the "Autocreate a Conversation" setting.
Importantly, save the new settings by clicking the Save button.
Click Sender Pool from the sidebar.
On the Sender Pool page, click the Add Senders button.
Select the Phone Number for the Sender Type and click Continue. Then, select the phone number you purchased at the start of this guide and click Add Phone Numbers.
Now that we have a Twilio account, a programmable phone number, and Twilio Conversations all set up, let's configure Single Sign-On, so that you can securely log in to Frontline.
Note: As part of the SSO configuration, you will name your Frontline instance with a Workspace ID in the Twilio Console. Take note of this Workspace ID, because you will use it later to sign in to the application.
Frontline requires an Integration Service that provides endpoints to function properly and that will serve as your backend.
You will deploy a pre-built Integration Service for your Twilio Frontline account through CodeExchange that implements all of Twilio Frontline's core features.
Log in to your Twilio account that you created above.
Set up your backend application by selecting the Twilio Phone number you want to text from. This is the number you’ve purchased earlier and represents the number that you will use to text with your contacts.
Configure your test customers phone numbers and add your Single Sign-On (SSO) username. In this step, you will add one to two SMS capable phone numbers that you want to text with. These numbers represent your "contacts" in Frontline. Next, you'll need to add your SSO username. This is the username added to your identity provider (i.e. Okta) when you registered in the application.
Click on the Deploy this application button to deploy the Node.js Functions to your Twilio Console. Once the Functions have been successfully deployed, you'll see the following message:
Next, click on Go to live application and follow the steps in the live application page to configure the Integration Service callbacks in your console.
Well done! You finished the Frontline Integration Service configuration. Now, you can download the Twilio Frontline application and log in to it.
To download the Frontline application to your mobile phone, you can navigate to the Twilio Frontline overview section in the Twilio Console, scroll down and download the application on App Store or Google Play Store.
The username and password to your SSO Identity Provider (i.e. Okta, Salesforce, etc.) developer account.
You'll be prompted for your SSO Identity provider credentials - enter the username and password that you used to sign up to your corresponding SSO developer account.
Well done! You’ve successfully logged into Twilio Frontline and you can start having a fun conversation using the Frontline app! 🎉
We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd by visiting Twilio's Stack Overflow Collective or browsing the Twilio tag on Stack Overflow.
