add flaks ui and Peft + LoRA fine tune

Author: Md-Emon-Hasan

.gitattributes

@@ -32,7 +32,7 @@ jobs:
           ${{ runner.os }}-buildx-
 
     - name: Build Docker image
-      run: docker build -t bilingual-bridge .
+      run: docker build -t translatica .
 
     - name: Test the application (Run tests inside container)
-      run: docker run --rm bilingual-bridge pytest tests/
+      run: docker run --rm translatica pytest tests/

.github/workflows/main.yml

@@ -10,8 +10,8 @@ COPY . /app
 # Install the dependencies
 RUN pip install --no-cache-dir -r requirements.txt
 
-# Expose Streamlit default port
-EXPOSE 8501
+# Expose the port Flask runs on
+EXPOSE 5000
 
-# Correct command to run Streamlit app
-CMD ["streamlit", "run", "app.py", "--server.port=8501", "--server.address=0.0.0.0"]
+# Command to run the Flask app
+CMD ["python", "app.py"]

Dockerfile

@@ -1,19 +1,19 @@
-# Bilingual Bridge: English to Spanish Translation
-[![Image](https://github.com/user-attachments/assets/0cc3d6e3-fda2-4037-8fad-f08c60442448)](https://github.com/user-attachments/assets/55599f0a-0a62-4bee-9406-b79212dd3890)
+# Translatica: English to Spanish Translation
+
 ## 📌 Overview
-Build a Machine Translation System capable of translating English text into Spanish using a fine-tuned Transformer-based model. The goal is to adapt a pre-trained multilingual model (Helsinki-NLP/opus-mt-en-es) on a domain-specific parallel corpus to improve translation. Deployed with a responsive Streamlit UI, containerized with Docker, and integrated with GitHub CI/CD for continuous delivery.
+Translatica is a Fine-tuned(with PEFT + LoRA) full-stack, LLM-powered translation system. This Machine Translation System capable of translating English text into Spanish using a fine-tuned Transformer-based model. Deployed with a responsive HTML, CSS & Flask, containerized with Docker, and integrated with GitHub CI/CD for continuous delivery.
+
+[![Image](https://github.com/user-attachments/assets/ee8472fe-644e-48e8-adaf-63787a4abd06)](https://github.com/user-attachments/assets/ee8472fe-644e-48e8-adaf-63787a4abd06)
 
 ---
 
 ## 🚀 Live Demo
-
 🎯 Try the real-time English → Spanish Translator here:  
-👉 [**Bilingual Bridge – Click Here**](https://bilingual-bridge.onrender.com/)
+👉 [**Translatica– Click Here**](https://bilingual-bridge.onrender.com/)
 
 ---
 
 ## ✅ Real-World Use Case
-
 In today's globalized digital ecosystem, cross-lingual communication is a key challenge. A **customized English-to-Spanish translation model** is highly valuable for:
 
   * 🌐 **Global E-Commerce Platforms** where product descriptions, reviews, and customer support need real-time translation.
@@ -25,65 +25,161 @@ In today's globalized digital ecosystem, cross-lingual communication is a key ch
 ---
 
 ## 📘 Technical Stack
-| **Category**         | **Technology/Resource**                                                                 |
-|----------------------|---------------------------------------------------------------------------------------|
-| **Programming Language** | Python 3.9+                                                                         |
-| **Core ML Framework** | HuggingFace Transformers 4.28+                                                      |
-| **Model Architecture** | MarianMT (Transformer-based Seq2Seq)                                               |
-| **Pretrained Model** | Helsinki-NLP/opus-mt-en-es                                                          |
-| **Dataset**          | OPUS Books (en-es) + Custom Spanish Parallel Corpus                                 |
-| **Data Processing**  | HuggingFace Datasets, Pandas, NLTK (Text Preprocessing)                            |
-| **Tokenization**     | SentencePiece (via HuggingFace Tokenizers)                                          |                                                    
-| **CI/CD Pipeline**   | GitHub Actions (Model Training/Evaluation Workflow)                                |
-| **Containerization** | Docker (with PyTorch Base Image)                                                   |
-| **Web UI**          | Streamlit UI                            |
-| **Hosting Services** | Render   |
+
+| Feature                        | Description                                                                 |
+| ------------------------------ | --------------------------------------------------------------------------- |
+| 🔁 **Translation**   | Translate fluently English to Spanish                                 |
+| 🧠 **Fine-Tuned LLM**          | Custom model fine-tuned using **LoRA + PEFT** on bilingual datasets         |
+| 🧰 **Techniques Used**         | Peft, LoRA (Parameter Efficient Fine-Tuning), SentencePiece Tokenizer        |
+| 🖥️ **Frontend**               | Responsive UI built with **HTML + CSS + JS**, integrated via Flask          |
+| 🧪 **Backend API**             | Lightweight Flask server with endpoint for dynamic translation              |
+| 🧠 **Tokenizer Customization** | Trained custom tokenizers with SentencePiece for improved language fidelity |
+| 💽 **Offline-Ready**           | Entire model is local & GPU-optional — designed for CPU-based deployment    |
+| 📦 **Modular Codebase**        | Fully modular design following clean code & MLOps practices                 |
+| 📊 **Tested Dataset**          | Trained and validated on Bangla-Spanish aligned translation corpus          |
+| 📉 **Evaluation**     | BLEU Score via `evaluate`       |
+| 🔧 **CI/CD Pipeline**   | GitHub Actions (Model Training/Evaluation Workflow)                                |
+| 🐳 **Containerization** | Docker                                                  |
+| 🚀 **Hosting Services** | Render   |
+
+---
+
+## ⚙️ Tech Stack
+
+* **Model**: [Helsinki-NLP/opus-mt-en-es](https://huggingface.co/Helsinki-NLP/opus-mt-en-es) (LoRA fine-tuned)
+* **Fine-Tuning**: LoRA + PEFT + Hugging Face Trainer
+* **Tokenizer**: SentencePiece (custom trained)
+* **Frontend**: HTML, CSS, JavaScript
+* **Backend**: Flask (Python)
+* **Deployment**: CPU-friendly, Flask server
+* **Project Structure**: Clean, modular, scalable
 
 ---
 
 ## 🧠 Model Training
-- **Dataset:** `opus_books` (English-Spanish parallel corpus)
-- **Model:** `Helsinki-NLP/opus-mt-en-es`
-- **Tokenizer:** SentencePiece tokenizer from pretrained model
-- **Fine-tuning:**
-  - Batch size: 16
-  - Epochs: 3
-  - Learning rate: 2e-5
-  - Weight decay: 0.01
-  - Early stopping used
-- **Saving:** Trained model and tokenizer saved for deployment
+
+* **🔡 Dataset:** [`opus_books`](https://huggingface.co/datasets/Helsinki-NLP/opus_books)
+
+  * English-Spanish parallel corpus
+  * High-quality literary translation data
+
+* **🏗️ Base Model:** [`Helsinki-NLP/opus-mt-en-es`](https://huggingface.co/Helsinki-NLP/opus-mt-en-es)
+
+  * Pretrained NMT model for English → Spanish
+
+* **🧪 Tokenizer:**
+
+  * SentencePiece tokenizer (`AutoTokenizer`) from the base model
+
+* **🧠 Fine-Tuning Strategy:**
+
+  * **PEFT (Parameter-Efficient Fine-Tuning)** using **LoRA (Low-Rank Adaptation)**
+  * **Frozen base model** — only LoRA-injected layers are trainable
+
+* **🧬 LoRA Configuration:**
+
+  * `r = 8`, `alpha = 32`, `dropout = 0.1`
+  * Target Modules: `["q_proj", "v_proj"]` (attention heads)
+
+* **⚙️ Trainer Configuration:**
+
+  * Epochs: `3`
+  * Batch Size: `16`
+  * Learning Rate: `2e-5`
+  * Weight Decay: `0.01`
+  * Evaluation: Per Epoch
+  * Early Stopping: Enabled
+  * Mixed Precision: Enabled (`fp16`)
+
+* **📊 Evaluation Metric:**
+
+  * BLEU Score using Hugging Face `evaluate` library
+
+* **📉 Training Performance:**
+
+| Epoch | Training Loss | Validation Loss | BLEU Score |
+| ----- | ------------- | --------------- | ---------- |
+| 1     | 1.3853        | 1.3317          | 0.1164     |
+| 2     | 1.3521        | 1.2777          | 0.1136     |
+| 3     | 1.3885        | 1.2645          | 0.1128     |
+
+* **💾 Saving Checkpoints:**
+
+  * Tokenizer: `tokenizer.save_pretrained("saved_tokenizer")`
+  * LoRA Adapter: `peft_model.save_pretrained("saved_peft_model")`
+
+* **📦 Trainable Parameters:**
+
+  * Only \~0.38% of parameters were updated
+  * Verified using: `peft_model.print_trainable_parameters()`
 
 ---
 
-## 🧱 Modular Codebase
+## 📊 Model Performance
+
+| Epoch | Training Loss | Validation Loss | BLEU Score |
+|-------|---------------|-----------------|------------|
+| 1     | 1.3853        | 1.3317          | 0.1164     |
+| 2     | 1.3521        | 1.2777          | 0.1136     |
+| 3     | 1.3885        | 1.2645          | 0.1128     |
+
+📌 **Observations**:
+- Training and validation loss gradually decreased.
+- BLEU score stabilized over epochs, indicating early convergence.
+- Indicates the model is learning but BLEU can be improved further with more epochs or tuning.
+
+---
+
+## 🧱 Project File Structure
 ```
 Bilingual-Bridge/
 │
-├── .github/                           # GitHub specific files
+├── .github/
 │   └── workflows/
-│       └── main.yml                   # GitHub Actions CI/CD workflow file
+│       └── main.yml
 │
-├── fine-tuned-model/                          
-│   └── fine-tuned-model/
-│   └── fine-tuned-tokenizer/      
+├── fine-tuned-model/
+│   ├── adapter_config.json
+│   ├── adapter_model.safetensors
+│   └── README.md
 │
-├── tests/
-│   └── data.py
+├── fine-tuned-tokenizer/
+│   ├── source.spm
+│   ├── special_tokens_map.json
+│   ├── target.spm
+│   ├── tokenizer_config.json
+│   └── vocab.json
 │
-├── src/                     
-│   └── data.py
-│   └── logger.py
+├── logs/
+│
+├── notebook/
+│   └── Experiment.ipynb
+│
+├── src/
+│   ├── data.py
+│   ├── logger.py
 │   └── model.py
 │
-├── app.py
-├── train.py
+├── static/
+│   ├── css/
+│   │   └── style.css
+│   └── js/
+│       └── script.js
+│
+├── templates/
+│   └── index.html
+│
+├── tests/
+│
+├── .gitignore
+├── app.png
+├── demo.mp4
+├── Dockerfile
+├── LICENSE
+├── README.md
+├── requirements.txt
 ├── setup.py
-├── logs/                   # Training and app logs
-├── app.png                 # Utility functions
-├── LICENSE  
-├── Dockerfile              # For containerization
-├── requirements.txt        # Dependencies
-└── README.md               # Project summary
+└── train.py
 ```
 
 ---
@@ -92,18 +188,18 @@ Bilingual-Bridge/
 ```mermaid
 sequenceDiagram
     participant User
-    participant StreamlitUI
-    participant TranslationApp
-    participant HuggingFace
-
-    User->>StreamlitUI: Enters English text
-    StreamlitUI->>TranslationApp: translate(input_text)
-    TranslationApp->>HuggingFace: Tokenize input
-    HuggingFace-->>TranslationApp: Tokenized output
-    TranslationApp->>HuggingFace: Generate Spanish tokens
-    HuggingFace-->>TranslationApp: Translated tokens
-    TranslationApp-->>StreamlitUI: Spanish text
-    StreamlitUI->>User: Displays translation
+    participant WebUI as Web UI (Flask + HTML/CSS)
+    participant TranslationServer as Translation App (Python)
+    participant HFModel as Hugging Face Model
+
+    User->>WebUI: Enter English text
+    WebUI->>TranslationServer: translate(input_text)
+    TranslationServer->>HFModel: Tokenize input
+    HFModel-->>TranslationServer: Return tokenized input
+    TranslationServer->>HFModel: Generate translation tokens
+    HFModel-->>TranslationServer: Return translated tokens
+    TranslationServer-->>WebUI: Return Spanish text
+    WebUI->>User: Display translated output
 ```
 
 ---
@@ -114,32 +210,13 @@ FROM python:3.10
 WORKDIR /app
 COPY . .
 RUN pip install -r requirements.txt
-CMD ["streamlit", "run", "app.py", "--server.port=8501", "--server.address=0.0.0.0"]
+CMD ["python", "app.py"]
 ```
 
 Build & run:
 ```bash
-docker build -t bilingual-bridge .
-docker run -p 8501:8501 bilingual-bridge
-```
-
----
-
-## 🖥️ Web App
-Features:
-- Input box for English text
-- Button-triggered translation
-- Spanish output display
-- Logs activity in real-time
-
-Example:
-```python
-translated_tokens = model.generate(
-    inputs['input_ids'],
-    max_length=256,
-    num_beams=8,
-    early_stopping=False
-)
+docker build -t translatica .
+docker run -p 8501:8501 translatica
 ```
 
 ---
@@ -168,4 +245,4 @@ streamlit run app.py
 🔗 **LinkedIn:** [Md Emon Hasan](https://www.linkedin.com/in/md-emon-hasan-695483237/)  
 🔗 **Facebook:** [Md Emon Hasan](https://www.facebook.com/mdemon.hasan2001/)
 
----
+---