Frontend Deployed Link: https://punt-partner-text-translator-deepak-y.netlify.app/
Project Presentation Video Link: https://www.loom.com/share/55ea11acb6354d6093eb84dc3ec61bb5
The Text Translator application allows users to translate text between various languages using a simple and intuitive interface. This app also supports speech recognition and text-to-speech functionalities, enhancing user interaction and accessibility.
- Translate text between multiple languages.
- Speech recognition to input text via microphone.
- Text-to-speech to listen to both input and translated text.
- Swap functionality to exchange source and target languages and texts.
- Clipboard copy functionality for both input and translated text.
- Frontend: React.js
- State Management: useState, useEffect
- Speech Recognition: react-speech-recognition
- HTTP Requests: Axios
- CSS: Custom styles
- API: LibreTranslate API for language translation
Ensure you have the following installed on your system:
- Node.js (>=14.x)
- npm (>=6.x)
-
Clone the repository:
git clone https://github.com/Deepak-25yadav/text-translator-fe.git cd text-translator
-
Install the dependencies:
npm install
-
Start the application:
npm start
-
Open the application:
Open your browser and navigate to
http://localhost:3000
to see the application in action.
-
Select Source and Target Languages:
Choose the source language (from) and target language (to) from the dropdown menus.
-
Input Text:
- Manual Input: Enter text in the input textarea.
- Speech Input: Click the microphone icon to start speech recognition and speak the text you want to translate.
-
Translate Text:
Click the "Translate" button to get the translated text in the target language.
-
Text-to-Speech:
Click the volume icon to listen to the input or translated text.
-
Copy Text:
Click the copy icon to copy the text to the clipboard.
-
Swap Languages:
Click the "Swap" button to exchange the input and translated texts and their respective languages.
-
Clear Text:
Click the "Clear Text" button to clear the translated text.
-
Reset Text:
Click the "Reset Text" button to clear the input text and reset the speech recognition transcript.
Contributions are welcome! If you have suggestions for improvements, feel free to open an issue or submit a pull request. Please follow the established code style and include tests for any new features or bug fixes.
This project is licensed under the MIT License. See the LICENSE file for more details.