A single-page Vue.js application that translates English text to Hindi (and other languages) using the Free Google Translator API from RapidAPI.
The app also maintains a history of the last 10 translated words/phrases in localStorage.
- Translate text between multiple languages (default English to Hindi)
- Displays translated text instantly
- Maintains a history of last 10 translations
- History persists across page reloads using localStorage
- Clear translation history button
- Language selection for source and target languages
- Text-to-speech functionality for translated text
- Proper error handling for API failures
link:https://translate-app-self-nine.vercel.app/
- Node.js (v14 or higher recommended)
- npm or yarn
- A RapidAPI account with access to the Free Google Translator API
- Clone the repository:
git clone https://github.com/yourusername/translate-app.git cd translate-app
- Install dependencies:
npm install
- Create a
.envfile in the project root and add your RapidAPI key:
VITE_RAPIDAPI_KEY=your_rapidapi_key_here
Note: Never commit your
.envfile or API keys to version control.
- Run the development server:
npm run dev
- Open your browser and go to
http://localhost:5173(or the port shown in your terminal).
- Enter the English text in the input box.
- Select the source and target languages.
- Click the Translate button.
- The translated text will appear below.
- Your translation history will show the last 10 translations.
- Use the Clear button to clear the history.
- Click the speaker icon to hear the translated text.
Unit tests are written using Vitest and Vue Test Utils.
Run tests with:
npm run test:unit
You can deploy this app easily on platforms like Netlify, Vercel, or Heroku.
Make sure to set the environment variable VITE_RAPIDAPI_KEY in your deployment settings.
Feel free to fork the repository and submit pull requests.
MIT License
For any queries, contact Aman Kumar Bind.