Next.js demo - Symbl.ai

This document describes how to implement the Symbl.ai Demo for Next.js.

For the source code, see Symbl.ai for Next.js Demo | github.com.

Symbl.ai Conversation Intelligence empowers developers to implement:

• Real-time analysis of free-flowing discussions to automatically surface highly relevant summary discussion topics, contextual insights, suggestive action items, follow-ups, decisions, and questions.

• Voice APIs that make it easy to add AI-powered Conversational Intelligence to either Telephony API or Streaming API (WebSocket) interfaces.

• Conversation APIs that provide a REST interface for managing and processing your conversation data.

• Summary UI with a fully customizable and editable reference experience that indexes a searchable transcript and shows generated actionable insights, topics, timestamps, and speaker information.

Enable Symbl.ai for Next.js Demo App

This is a Demo app showcasing Symbl.ai capabilities using ReactJS, Typescript, and NextJS.

Setup

The first step is to sign up at Symbl.ai Platform.

Authorization

1. Create a .env file in the root directory using the .env.sample as an example.

2. Update the .env file with the following:

   • Your App Id that you can get from Symbl.ai Platform.
   • Your App Secret that you can get from Platform.

Install & Deploy

1. Run yarn install or npm install.
2. To run the app use yarn dev.
3. Navigate to localhost:3000 to view the app.

Integration

Project Structure

• pages In Next.js, a page is a React Component exported from a .js, .jsx, .ts, or .tsx file in the pages directory. Each page is associated with a route based on its file name. You can read more about how works with pages. Each tab in the application corresponds to the following pages subdirectories
  • pages/api => Phone Call
  • pages/audio => Phone(Client Only)
  • pages/conversations => Conversation data
  • pages/text => Text
  • pages/audio => Audio
  • pages/video => Video

Conclusion

This application offers options to explore the following Symbl.ai Conversation Intelligence features.

1. PSTN call implemented with the JS SDK featuring real time transcription and insights.

2. PSTN call implemented with the Telephony API featuring real time transcription, insights, and Symbl.ai React Elements.

3. Processed conversation data accessed from the Conversations API featuring participants and insights.

4. Async Text featuring Symbl.ai React Elements, transcription, and insights.

5. Async Audio featuring Symbl.ai React Elements, transcription, and insights.

6. Async Video featuring Symbl.ai React Elements, transcription, and insights.

Community

If you have any questions or comments, contact us at [email protected], through our Developer Slack, or Developer Community.

Source code available at Symbl.ai for Next.js Demo | github.com.