Bit6, a Telerik Verified Plugins Marketplace Partner, provides a tutorial on leveraging their services to add real-time messaging and WebRTC video to your hybrid mobile app.
Letting your users communicate might be an essential requirement for your app—but even if you haven't considered adding real-time communications to your app, give it a second thought! Humans are a social species, and letting your users interact with each other within the app can make a world of difference to your metrics.
Here you will find everything you need to embed communications into your hybrid mobile app using Telerik Platform and Bit6—from messaging with attachments to voice and video calls!
In this article you will learn:
- What types of messaging and video features are supported
- How to quickly try the sample app
- How easy it is to add communications to your own app
Communications Essentials to Be Excited About
The communication features that Bit6 brings are:
- WebRTC video—one to one and one to many
- IP messaging—direct and group messages
- Attachments in any form—photo, video, audio
- Native push support for Andorid and iOS
Additionally, some of the nice perks that might make your life easier include:
- Presence detection
- Voice calling
- Peer to peer data transfer
Let's get started!
Prerequisites
- Set up a free 30-day trial of a Telerik Platform account
- Get a Bit6 API Key for your app from Bit6 Dashboard
- Configure Push Notification support for Android GCM and/or iOS APNS
Try the Sample App
To get a snapshot of what you are getting with Bit6, try the sample app directly on Telerik Platform. Just click the "Try in AppBuilder" button below. You may be asked to sign into your Telerik account, so have your credentials handy.
One other thing you need for the sample app to work is Telerik Cloud Functions, which are neatly described in the Telerik Integration guide.
The Bit6 sample app uses Telerik Backend Services for easy user management and authentication.
Start Your Own Development
Before you start developing your app, there are a few configuration steps you need to take care of:
Project Configuration
- Set the App ID for your app:
Project Navigator > Properties > General - Important! Make sure to use correct iOS app id—the same one used for APNS registration:
Certificates
For iOS you need to configure the certificates for the push notifications to function properly—those are what makes the communications truly real-time.
To configure provisioning profiles and certificates:
- Click the cog icon and select
Options
- Select
iOS → Provisioning Profiles
- Click
Import - Select
Cryptographic Identitiesand import the appropriate P12 file
Set API Key
If you haven't done so already, get your Bit6 API key here.
Edit js/index.js file to set your Bit6 API Key:
var opts = {'apikey': 'myApiKey'};
Build
Go to Run -> Build and select the platform.
Make sure to choose
App packageas Bit6 does not work with the Telerik Platform Companion App.
Sample App Preview
Before you deep dive into the development of new exciting communications capabilities for your own app, take a sneak peak at our sample app. It showcases how to let your users interact WhatsApp-style (including attachments and photo sharing), make video calls, and have fun with group chatting.
IP Messaging
With our direct or group messaging, your users will be thrilled to explore the whole new level of communication, sending text, photos, video messages, and getting the status updates in real time—whenever their recipient reads the message or starts typing, the feedback is instant.
On both Android and iOS, users can easily send media messages—adding existing photo and video files, snapping new pictures. This functionality is shown well in the demo app:
Video and Voice Calling
Another sought-after communications capability is the voice and video calling. WebRTC-powered, high quality video is essential for apps in telemedicine, education, and social industries. The Bit6 demo app is ideal to quickly and easily test the video and voice calling.
Next Steps
Authentication Methods
Now that we have a working application, you can experiment with other user authentication mechanisms. For simplicity we used basic username and password login.
Any authentication method supported by Telerik Platform can be used in your application. Telerik's Social Login intro provides all the information you need in this respect.
Other Resources
- Bit6 Cordova Plugin in the Telerik Verified Plugins Marketplace
- View Bit6 JS SDK documentation
- Follow Quick Start Guides for Android, iOS, and JS
- Check out other Bit6 resources at GitHub
- Get familiar with Bit6 communication APIs and SDKs