Skip to content

anthonychu/captionr

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

52 Commits
 
 
 
 
 
 
 
 

Repository files navigation

CaptionR

Serverless real-time captioning and translation using:

Resources

Demo

CaptionR Demo

Blog Post

Real-time Speech-to-Text and Translation with Cognitive Services, Azure Functions, and SignalR Service

Architecture

Project architecture

Project setup

The app has 2 main projects:

  • Vue.js frontend in src/vueapp
  • Azure Functions backend in src/functions-javascript (C# and Java also available)

Azure resources

You'll also need to create a couple of free resources on Azure to get started:

Azure Speech Services - free tier

az cognitiveservices account create -n $SPEECH_SERVICE_NAME -g $RESOURCE_GROUP_NAME --kind SpeechServices --sku F0 -l westus
az cognitiveservices account keys list -n $SPEECH_SERVICE_NAME -g $RESOURCE_GROUP_NAME

F0 is the free SKU. You can also create it in the portal.

Azure SignalR Service - free tier

az signalr create -n $SIGNALR_NAME -g $RESOURCE_GROUP_NAME --sku Free_DS2 -l westus
az signalr key list -n $SIGNALR_NAME -g $RESOURCE_GROUP_NAME

You can also create it using the portal.

Vue.js app

Install npm packages and start the Vue.js dev server:

npm install
npm run serve

Azure Function app

Create a file named local.settings.json (copy from local.settings.sample.json). Fill in the SignalR Service connection string.

With the Azure Functions Core Tools installed, run the function app:

(JavaScript)

func extensions install
func start

More information

Check out the blog post.