lekoundanmgedeon/nlp-lingua-lingala
Domaine:
natural language processingType de record:
softwareproject
Créateur:
lek
Hôte:
# LinguaLingala — Frontend
A production-grade Vue.js 3 chatbot interface for the LinguaLingala NLP system.
Supports **Lingala → French / English** translation, sentiment analysis, and cultural explanations.
---
## Tech stack
| Layer | Technology |
|---|---|
| Framework | Vue 3 (Composition API) |
| Build tool | Vite 5 |
| State | Pinia |
| HTTP client | Axios |
| Router | Vue Router 4 |
| Fonts | Sora + JetBrains Mono (Google Fonts) |
---
## Quick start
```bash
# 1. Install dependencies
npm install
# 2. Configure environment
cp .env.example .env
# Edit .env and set VITE_API_BASE_URL to your FastAPI backend
# 3. Start dev server
npm run dev
# → localhost
# 4. Build for production
npm run build
```
---
## Project structure
```
src/
├── assets/
│ └── main.css # Global design tokens, dark mode, animations
├── components/
│ ├── ChatWindow.vue # Scrollable chat container + empty state + typing indicator
│ ├── MessageList.vue # Renders all message types (user / AI / error)
│ ├── MessageInput.vue # Auto-resize textarea + send button + error banner
│ └── LanguageSelector.vue # FR / EN language toggle
├── composables/
│ ├── useScrollToBottom.js # Reactive auto-scroll helper
│ └── useTimeFormat.js # Timestamp formatters
├── services/
│ └── api.js # Axios instance + translateText / analyzeSentiment / chatWithAI
├── store/
│ └── chatStore.js # Pinia store: messages, loading, errors, settings
├── views/
│ └── ChatView.vue # Main layout: sidebar + header + chat + input
├── App.vue
└── main.js
```
---
## Backend API contract
The frontend expects a FastAPI backend with the following endpoints:
### `POST /chat` (primary)
```json
// Request
{ "text": "Nazali na esengo.", "target_lang": "fr", "session_id": "sess_..." }
// Response
{
"original": "Nazali na esengo.",
"translation": "Je suis heureux.",
"sentiment": "positive",
"confidence": 0.94,
"intensity": " …