Twilio Flex Quickstart: Getting Started with Flex Plugin Development
In just a few minutes, you can extend and modify your Twilio Flex call center instance using the JavaScript React framework.
During this Quickstart, you'll use React to customize your Flex instance by integrating a search engine into the Flex CRM container. This Quickstart only involves cutting/pasting some React code. If you want to learn more, check out the official React Docs.
At the end of this Quickstart, you'll know how to develop a Flex plugin, test it locally, and upload your changes to a Twilio-hosted Flex instance. Once you've seen basic changes you can make with React, you can start to make more extensive modifications to your contact center instance.
In this Quickstart, we will:
- Create a new Flex hosted instance
- Install the Flex Plugins CLI
- Walk through the plugin creation steps locally
- Develop your plugins locally
- Deploy your plugins and enable your plugin on your Flex application
- Verify your changes in the Twilio hosted call center instance
Prefer other styles of learning? See our collection of Flex video tutorials and demos.
Before you start working on plugins for Flex, you'll need a cloud call center instance to apply them on. Let's create a new Flex instance now.
Info
If you already have a Twilio Flex instance you'd like to customize, feel free to skip ahead to the plugin prerequisites.
Before you can work with Flex, you'll need to sign up for a Twilio account or sign into your existing account.
-
Once in the console, navigate to the Flex product:
npm -vin your terminal to check)A Node.js long-term-support (LTS) version installed (type
node -vin your terminal to check):- React v16 recommended for Flex UI 1.x
- React v17 recommended for Flex UI 2.x
- Twilio CLI installed on your machine. We recommend installing the latest version of the Twilio CLI.
In order to run the CLI commands, on your Flex application run the following command:
_10twilio loginYou will be prompted for your Account SID and Auth Token, both of which you can find in the Twilio Console Dashboard.