{"id":22117325,"url":"https://github.com/arnobt78/FreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","last_synced_at":"2025-10-12T06:31:51.426Z","repository":{"id":255679648,"uuid":"853359273","full_name":"arnobt78/FreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","owner":"arnobt78","description":"FreeScribe is a Machine Learning React Vite TailwindCSS Web Based Transcription \u0026 Translation App that uses Web Workers to run ML models in the browser. This app allows you to record your voice or upload an audio file (mp3/wav), transcribe it to text, translate it into any language, download/ copy the freshly converted text that has be transcribed.","archived":false,"fork":false,"pushed_at":"2025-07-30T11:57:56.000Z","size":103,"stargazers_count":5,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-21T21:27:26.052Z","etag":null,"topics":["audio-transcribing","audio-transcription","audio-translation","machine-learning","media-transcription","mp3-transcription","react-vite-tailwindcss","scribe","speech-to-text","transcription","transcription-translation","translation","voice-to-text","voice-to-text-transcription","voice-transcription","voice-transformation","voice-translator","web-worker","web-worker-react","xenova-transformers"],"latest_commit_sha":null,"homepage":"https://free-scribe-arnob.vercel.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/arnobt78.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-09-06T13:54:58.000Z","updated_at":"2025-07-30T11:57:59.000Z","dependencies_parsed_at":"2024-09-06T17:51:33.313Z","dependency_job_id":"819d902a-5b2e-4cfd-aad2-87d1db5e003a","html_url":"https://github.com/arnobt78/FreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","commit_stats":null,"previous_names":["arnobt78/freescribe-ml-react-webapp","arnobt78/freescribe-ml--reactvite","arnobt78/freescribe-transcription-translation-ml--react","arnobt78/freescribe-transcription-translation-ml--react-fullstack"],"tags_count":0,"template":true,"template_full_name":null,"purl":"pkg:github/arnobt78/FreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/arnobt78","download_url":"https://codeload.github.com/arnobt78/FreeScribe-Transcription-Translation-Machine-Learning--React-FullStack/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279010507,"owners_count":26084757,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-12T02:00:06.719Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["audio-transcribing","audio-transcription","audio-translation","machine-learning","media-transcription","mp3-transcription","react-vite-tailwindcss","scribe","speech-to-text","transcription","transcription-translation","translation","voice-to-text","voice-to-text-transcription","voice-transcription","voice-transformation","voice-translator","web-worker","web-worker-react","xenova-transformers"],"created_at":"2024-12-01T13:31:51.126Z","updated_at":"2025-10-12T06:31:51.421Z","avatar_url":"https://github.com/arnobt78.png","language":"JavaScript","readme":"# FreeScribe — Machine Learning Powered Voice/Audio Transcription \u0026 Translation React Web App\n\n![Screenshot 2024-09-06 at 16 57 25](https://github.com/user-attachments/assets/d6d0c53e-5b3e-4d49-b6e8-1dfbc6808a0f) ![Screenshot 2024-09-06 at 16 57 51](https://github.com/user-attachments/assets/ce94c628-8103-44d0-ae0e-4f7dc184f404) ![Screenshot 2024-09-06 at 16 58 10](https://github.com/user-attachments/assets/794bde3c-d08d-43cc-9e49-eb44033fe4a6) ![Screenshot 2024-09-06 at 16 58 17](https://github.com/user-attachments/assets/3ae53a9c-7908-4e09-bdbf-0e922a436789) ![Screenshot 2024-09-06 at 16 58 30](https://github.com/user-attachments/assets/77398251-b28d-4194-a27c-52690589d3bf) ![Screenshot 2024-09-06 at 16 58 48](https://github.com/user-attachments/assets/cf804485-b6ad-4fa3-8040-9a26fe7845b9) ![Screenshot 2024-09-06 at 16 59 46](https://github.com/user-attachments/assets/98b2b40f-d2fc-4c03-bead-d80b91fc1ed9)\n\n---\n\n## Project Summary\n\n**FreeScribe** is a modern, open-source transcription and translation web application that leverages on-device machine learning models, running entirely in your browser using Web Workers. Users can record or upload audio, transcribe speech to text, translate between languages, and export the results — all with privacy and speed, without sending data to any backend server.\n\n- **Live-Demo:** [https://free-scribe-arnob.vercel.app/](https://free-scribe-arnob.vercel.app/)\n\n---\n\n## Table of Contents\n\n- [Project Summary](#project-summary)\n- [Features](#features)\n- [Technology Stack](#technology-stack)\n- [Project Structure](#project-structure)\n- [How It Works](#how-it-works)\n  - [Web Worker Architecture](#web-worker-architecture)\n  - [Machine Learning Model](#machine-learning-model)\n- [Getting Started](#getting-started)\n  - [Installation](#installation)\n  - [Running Locally](#running-locally)\n- [Usage Walkthrough](#usage-walkthrough)\n- [Teaching Content \u0026 Examples](#teaching-content--examples)\n- [Keywords](#keywords)\n- [Conclusion](#conclusion)\n- [License](#license)\n\n---\n\n## Features\n\n- 🎙️ **Audio Input:** Record live or upload MP3/WAV files for transcription.\n- ✍️ **Transcription:** Converts speech to text using ML models (OpenAI Whisper).\n- 🌎 **Translation:** Translate transcribed text into multiple languages.\n- ⚡ **Runs Locally:** All ML inference runs in-browser via Web Workers for privacy and speed.\n- 💾 **Export:** Download or copy the resulting text.\n- 🚀 **Modern UI:** Built with React, Vite, and TailwindCSS.\n- 💡 **No Cost:** 100% free and open-source.\n\n---\n\n## Technology Stack\n\n- **Frontend:** React 18, Vite, TailwindCSS\n- **Web Worker ML:** [`@xenova/transformers`](https://github.com/xenova/transformers.js)\n- **Transcription Model:** OpenAI Whisper (via transformers.js)\n- **Other:** ESLint, PostCSS, modern ES2020+ JavaScript\n\n---\n\n## Project Structure\n\n```\n/\n├── public/\n│   └── vite.svg           # App icon\n├── src/\n│   ├── components/\n│   │   ├── Header.jsx     # Top navigation and branding\n│   │   ├── Footer.jsx     # Footer\n│   │   ├── HomePage.jsx   # Landing/upload UI\n│   │   ├── FileDisplay.jsx# Audio file display and controls\n│   │   ├── Information.jsx# Output display\n│   │   └── Transcribing.jsx # Loading/transcribing UI\n│   ├── utils/\n│   │   ├── presets.js     # Worker message types, language codes, model names\n│   │   └── whisper.worker.js # Main ML Web Worker logic\n│   ├── App.jsx            # Main application logic\n│   ├── main.jsx           # Entry point\n│   └── index.css          # Tailwind and custom styles\n├── index.html             # HTML template\n├── package.json           # Dependencies \u0026 scripts\n└── ... (config files)\n```\n\n---\n\n## How It Works\n\n### Web Worker Architecture\n\n- The app delegates heavy ML inference to a **Web Worker** (`whisper.worker.js`). This prevents UI blocking and ensures smooth user experience.\n- The worker receives audio data, loads the ML model (Whisper), and performs transcription/translation asynchronously.\n- Communication uses structured messages (see `presets.js` for message types).\n\n### Machine Learning Model\n\n- **Transcription** uses the *OpenAI Whisper* model, via `@xenova/transformers`, running entirely in-browser (no server needed).\n- **Translation** is performed using Whisper’s multilingual capabilities and language codes defined in `presets.js`.\n- Model progress and results are streamed back to the main app for display.\n\n---\n\n## Getting Started\n\n### Installation\n\n1. **Clone the repo:**\n   ```bash\n   git clone https://github.com/arnobt78/FreeScribe-Transcription-Translation-ML-App--ReactVite.git\n   cd FreeScribe-Transcription-Translation-ML-App--ReactVite\n   ```\n\n2. **Install Node.js:**  \n   Download and install from [nodejs.org](https://nodejs.org/en/).\n\n3. **Install dependencies:**\n   ```bash\n   npm install\n   ```\n\n4. **Install Transformers.js:**\n   ```bash\n   npm i @xenova/transformers\n   ```\n\n### Running Locally\n\nStart the development server:\n```bash\nnpm run dev\n```\nOpen [http://localhost:5173/](http://localhost:5173/) in your browser.\n\n---\n\n## Usage Walkthrough\n\n1. **Home Screen:**  \n   Select to record audio or upload an MP3/WAV file.\n\n2. **Audio Processing:**  \n   Once uploaded or recorded, the file is displayed. Click \"Transcribe\" to start.\n\n3. **ML Inference:**  \n   The app loads the Whisper model in a web worker and processes your audio.\n\n4. **View \u0026 Translate:**  \n   The transcribed text appears. Use translation options to convert it into another language.\n\n5. **Export or Copy:**  \n   Download the text as a file or copy it to your clipboard.\n\n---\n\n## Teaching Content \u0026 Examples\n\n### Example: Adding a New Language\n\nTo add a new translation language, extend the `LANGUAGES` object in `src/utils/presets.js`:\n\n```javascript\nexport const LANGUAGES = {\n  ...,\n  \"Spanish\": \"spa_Latn\",\n  // Add more as needed\n};\n```\n\n### Example: Using the Web Worker\n\nThe worker is initialized in `App.jsx`:\n\n```javascript\nworker.current = new Worker(new URL('./utils/whisper.worker.js', import.meta.url), { type: 'module' });\nworker.current.postMessage({\n  type: MessageTypes.INFERENCE_REQUEST,\n  audio,\n  model_name: 'openai/whisper-tiny.en'\n});\n```\n\nThe worker receives audio, runs the model, and sends back results via `postMessage`.\n\n---\n\n## Keywords\n\n- Transcription\n- Translation\n- Machine Learning\n- React\n- Vite\n- TailwindCSS\n- Web Worker\n- OpenAI Whisper\n- Speech Recognition\n- @xenova/transformers\n- In-browser ML\n- Audio Processing\n\n---\n\n## Conclusion\n\nFreeScribe streamlines advanced speech-to-text and language translation—directly in your browser, for free. Powered by modern frontend tools and the latest open-source ML models, it’s a practical, privacy-respecting alternative to expensive SaaS solutions.\n\n---\n\n## License\n\nMIT License. © 2030 [arnobt78](https://github.com/arnobt78)\n\n---\n\n## Happy Coding! 🎉\n\nFeel free to use this Project Repository and extend this project further!  \n\nIf you have any questions or want to share your work, reach out via GitHub or my portfolio [https://arnob-mahmud.vercel.app/](https://arnob-mahmud.vercel.app/).\n\n**Enjoy building and learning!** 🚀\n\nThank you! 😊\n\n---\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Farnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farnobt78%2FFreeScribe-Transcription-Translation-Machine-Learning--React-FullStack/lists"}