Follow this README to build your multilingual chat app with the help of PubNub ChatEngine. ChatEngine is a framework for building chat apps for any chat-related use case. It is feature rich, extensible and designed to work at scale, thanks to the globally available PubNub Data Stream Network. Check out the complete feature list of PubNub ChatEngine.
This repository contains an example chat app built with ChatEngine, which has language translation capabilities. AWS Translate service powers the language translation feature. You can easily integrate AWS Translate API in this chat app.
The source code for this chat app is in Javascript. The UI frontend uses the standard javascript libraries like JQuery, so some level of familiarity with JQuery and standard Javascript language is expected.
For reference, here is the complete documentation of PubNub ChatEngine. The AWS Translate documentation can be accessed in this link.
Once built, the app can establish a chat session between two predefined users, John and Peter. It features an on-the-fly language selection drop-down through which the users can choose the language in which they want to receive the messages in. Take a look at this screenshot to get a feel for the language translation feature of this chat app.
You can follow the sections below to build this example chat app in no time. However, before you begin, you must have an account in PubNub and AWS.
-
Create your PubNub developer account
-
Create your free AWS account
First, you need to set up the ChatEngine enabled PubNub app in your account.
Step 1 : Login to your PubNub App Console
Follow these steps in ChatEngine QuickStart Tutorial to set up your chat app instance. Check the first step "Configure Your Account" in quickstart tutorial and click on the setup button.
Step 3 : Wait for a few seconds. Once done, you will get a new PubNub app created within your account with a new set of publish and subscribe keys.
Now your app infrastucture is created. For enabling multilingual chat feature, head over to the next section.
Follow these steps to setup your AWS Translate service
Follow these steps to create an IAM user for AWS Translate. Make sure that the IAM user has full permissions for accessing AWS Translate service.
Download the credentials file for the IAM user and save it. This file contains the AWS ACCESS KEY and AWS SECRET KEY.
Follow these steps to setup PubNub Function to serve as the backend for the multilingual chat app.
Head over to your PubNub dashboard and select the "ChatEngine App" app. Follow the official document of PubNub Function to create a function for this app by clicking on the "Functions" menu on the sidebar.
Use the following parameters for creating the module and function
Copy the AWS Translate backend code and paste it in the code window.
Add your AWS ACCESS KEY and AWS SECRET KEY (Step 2 of "Set Up AWS Translate Service") in the My Secrets vault as shown below.
Now you can launch the function.
Follow these steps to test the app.
Clone this repository under a local folder
Update the PubNub publish key for both the chat app instances for John and Peter.
Repeat the same steps for updating the PubNub subscribe key for John and Peter.
Now you can launch both the chat app instances for John and Peter and start chatting. Remember, the translation feature is only enabled for Peter while John can chat only in English. This is because AWS Translate currently supports translation to and from English only.
Have fun!