Build an Interactive Audio Live Streaming Experience

This guide describes how to set up an audio interactive live audio streaming application for iOS where you can join a Room as a moderator, speaker, or audience member. You will deploy a backend application that handles creating and joining Twilio Video Rooms and streaming the content, and run an iOS application that handles the moderator, speaker, and audience UI.

Requirements

Node.js v14+
NPM v7+ (upgrade from NPM 6 with npm install --global npm)
CocoaPods
Xcode

Set up the backend application

First, clone the Live Interactive Audio GitHub repository.

Next, navigate into that cloned repository. Copy the .env.example file in the root twilio-live-interactive-audio directory and create a new file called .env:

cp .env.example .env

Then, fill in the values in the .env file:

ACCOUNT_SID and AUTH_TOKEN: Find these values on the Twilio Console landing page.
TWILIO_API_KEY_SID and TWILIO_API_KEY_SECRET: Create a new API key in the Twilio Console and use the key's SID and secret for these values.
CONVERSATIONS_SERVICE_SID: This application uses Twilio Conversations to power an in-app chat functionality. Create a new Conversations Service in the Twilio Console, or use the SID of your account's default Conversation Service (also found in the Console).
PASSCODE: Update this value to be any six-digit numeric passcode. You will use this to access the streaming application.

Once you have collected and stored these values in the .env file, you can install the project's dependencies:

npm install

Deploy the application

After the install is done, deploy the backend application:

npm run deploy

When the deploy is complete, the output will include a public URL for the deployed application. Make note of this URL, as you will need it in the next step when building the iOS audience application.

If you make any changes to this application, you can run npm run deploy again to deploy the new changes to your application.

Run the iOS application

Set up the application

First, update the url variable in the app source file to point to the public URL you received after deploying your application in the previous step.

//twilio-live-interactive-audio/apps/ios/LiveStream/LiveStream/API/Core/API.swift

class API {
    static var shared = API()
    private let session = Session()
    private let jsonEncoder = JSONEncoder()
    private let jsonDecoder = JSONDecoder()
    private let url = <YOUR BACKEND URL HERE>
//...

Next, install the iOS application's dependencies with CocoaPods. Move to the apps/ios folder within the main project directory and then install the project dependencies with CocoaPods:

cd apps/ios
pod install

Run the application

Use Xcode to run the application. Open the twilio-live-interactive-audio/apps/ios project folder with Xcode and click the "Run" button within Xcode.

Once the application is running, enter a unique name and the passcode you set in the backend application.

You can then create a new room, which you will join as a speaker. Open a new simulator or join from a different device to test the audience view.

Need some help?

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.