TTS & Translate App | Serverless Functions, Google Translate & Web Speech API

Jan 20, 2025Channel
AI Analysis
Data from YouTube Data API v3Updated Just now

Video Overview

Video Details

PublishedJan 20, 2025
Duration45:22
Video IDV0P3Opf-zUs
Languageen
CategoryScience & Technology
PrivacyPublic
Made for KidsNo
Video TypeRegular Video

Performance Metrics

Views10.9K
Likes530
Comments25
Engagement Rate5.09%
Likes per 100 views4.86
Comments per 1K views2.29

Description

We will build a JavaScript web app that takes in some text and does TTS as well as the option to select a language to translate to. We will use the Vercel CLI and a serverless function fot the translation and API KEY security. Tailwind CSS for styling. Final Code: https://github.com/bradtraversy/tts-translate For more Vanilla JS projects, check out these courses: 20 Vanilla JS Projects: https://www.traversymedia.com/20-Vanilla-JavaScript-Projects Modern JS From the Beginning: https://www.traversymedia.com/modern-javascript-2-0 50 Projects In 50 Days: https://www.traversymedia.com/50-Projects-In-50-Days Timestamps: 0:00 - Intro 2:22 - Project Structure 4:38 - HTML & Tailwind Classes 8:32 - Web Speech API & TTS 11:10 - Get Voices 16:20 - Language Selection 20:06 - Google Translate API Key Setup 21:29 - Vercel CLI Setup 23:57 - Creating a Serverless Function 26:57 - dotenv Setup 29:22 - Google Translate API Request 32:58 - Test Function With Postman 34:18 - Make Request To Serverless Function Endpoint 38:39 - Translate Text & Play TTS 43:21 - Deploy To Vercel

Related Videos

More videos from Traversy Media