Built with the latest Next.js and TypeScript, LinguaSpeak is an advanced voice translation tool. It allows users to speak into the microphone, translate the spoken text to another language, and playback the translation. This project is perfect for those looking to learn how to integrate speech recognition and translation APIs into a Next.js application.

⭐ Preline: https://preline.co/docs/index.html
⭐ TailwindCSS: https://tailwindcss.com/
⭐ Tabler Icons: https://tabler.io/icons
⭐ Aceternity UI: https://shorturl.at/3p5Dp

📚 Materials/References:
GitHub Repo (give it a star ⭐): https://github.com/mendsalbert/lingua...
README (assets & code): https://github.com/mendsalbert/lingua...

❤️ BuyMeACoffe : https://www.buymeacoffee.com/mendalbert

👋 Social Media:
  / mendsalbert  
  / mendsalbert_  
  / mends-albert  


Subscribe or your gradient Vanishes
╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗
║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣
╠╗║╚╝║║╠╗║╚╣║║║║║═╣
╚═╩══╩═╩═╩═╩╝╚╩═╩═╝

💼 Business Inquiries: [email protected]

Timestamps 
00:00:00 - Intro + demo
00:01:21 - project setup
00:06:03 - background + Title section
00:18:43 - textarea section
00:34:09 - speech recognition component + TextArea Icons
01:07:48 - useTranslate Hook
01:19:30 - utils function
01:20:00 - putting it all together
01:30:57 - environmental variable bug +fixes
01:36:09 - finishing up
01:42:41 - testing
01:44:15 - hosting + conclusion

👨🏽‍💻 Tools and Tech Stack
React JS, NextJs, TailwindCSS,Typescript, Preline, Openai API, Tabler Icons, Javascript, AI.