Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jossyboydgenius/lingua-speak
https://github.com/jossyboydgenius/lingua-speak
Last synced: about 1 month ago
JSON representation
- Host: GitHub
- URL: https://github.com/jossyboydgenius/lingua-speak
- Owner: Jossyboydgenius
- Created: 2024-12-09T23:39:36.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2024-12-09T23:44:56.000Z (2 months ago)
- Last Synced: 2024-12-10T00:28:26.774Z (2 months ago)
- Language: TypeScript
- Size: 0 Bytes
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
LinguaSpeak
Build this project step by step with our detailed tutorial on Your YouTube Channel. Join the community!
## 📋 Table of Contents
1. 🤖 [Introduction](#introduction)
2. ⚙️ [Tech Stack](#tech-stack)
3. 🔋 [Features](#features)
4. 🤸 [Quick Start](#quick-start)
5. 🕸️ [Assets & Code](#snippets)
6. 🚀 [More](#more)
## 🚨 Tutorial
This repository contains the code corresponding to an in-depth tutorial available on our YouTube channel, Code with Tech Apostle.
If you prefer visual learning, this is the perfect resource for you. Follow our tutorial to learn how to build projects like these step-by-step in a beginner-friendly manner!
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.
If you're getting started and need assistance or face any bugs, join our active Discord community. It's a place where people help each other out.
- Next.js
- TypeScript
- OpenAI API
- React Speech Recognition
- Tailwind CSS
## 🔋 Features
👉 **Speech Recognition**: Converts spoken words into text using the Web Speech API.
👉 **Text Translation**: Translates the recognized text into a selected target language using OpenAI's GPT-4 model.
👉 **Audio Playback**: Converts translated text back into speech using the Web Speech API's speech synthesis.
👉 **File Upload**: Reads and translates text from uploaded files, including RTF to plain text conversion.
👉 **Link Content Fetching**: Fetches and translates text content from provided URLs.
👉 **Language Selection**: Allows users to select target languages for translation.
👉 **Copy to Clipboard**: Copies the translated text to the clipboard.
👉 **Like, Dislike, and Favorite**: Provides user interaction features for translations.
👉 **Responsive Design**: Ensures a seamless experience across different devices.
Follow these steps to set up the project locally on your machine.
**Prerequisites**
Make sure you have the following installed on your machine:
- [Git](https://git-scm.com/)
- [Node.js](https://nodejs.org/en)
- [npm](https://www.npmjs.com/) (Node Package Manager)
**Cloning the Repository**
```bash
git clone https://github.com/jossyboydgenius/lingua-speak.git
cd linguaspeak
```
**Installation**
Install the project dependencies using npm:
```bash
npm install
```
**Set Up Environment Variables**
Create a new file named `.env` in the root of your project and add the following content:
```env
NEXT_PUBLIC_API_KEY=your-openai-api-key
```
Replace the placeholder values with your actual OpenAI credentials. You can obtain these credentials by signing up on the [OpenAI website](https://openai.com/).
**Running the Project**
```bash
npm run dev
```
Open [http://localhost:3000](http://localhost:3000) in your browser to view the project.