Transcriber

Transcriber is a web app using Google speech-to-text API for transcribing audio files. Transcoding, transcription and database is handled by Cloud functions and Firebase, while React JS is used for the web frontend.

Tech overview

• React JS
• Redux
• Google Cloud Storage
• Cloud Functions for Firebase
• Cloud Speech-to-text
• Cloud Firestore

Set up

• Follow the steps in setting up the backend.
• Rename .env.sample to .env
• In the Firebase Console, Choose "Add Firebase to your web project" copy the values of apiKey, databaseURL, and the name of your uploads bucket and paste them in to .env.
• Run npm install to install dependencies.

Development

npm run dev

Authentication in development

You need to enable username/password authentication in Firebase Console. Create an user, and set a password. Here is how in June 2019:

• Enable Email/Password provider
  • https://console.firebase.google.com/u/3/project//authentication/providers
• Add user in Users tab
  • https://console.firebase.google.com/u/3/project//authentication/users
• Set password on your newly created user
  • Dropdown menu to the right of the user in Users tab

Update .env

Add username and password to REACT_APP_FIREBASE_DEV_USERNAME and REACT_APP_FIREBASE_DEV_PASSWORD

Google Analytics

To track events to Google Analytics, enter your GOOGLE_ANALYTICS_PROPERTY_ID in the .env file. The following events are tracked:

All pages

Create transcript

Transcript page

Browsers targeted

npx browserslist ">0.25% in my stats, not IE > 0"

chrome 69
chrome 68
chrome 67
edge 17
edge 16
firefox 61
ios_saf 11.3-11.4
safari 11.1
safari 11