bmouss25/tunisian-netlify

# 🇹🇳 Tounsi App — Déploiement Netlify Application React pour apprendre le dialecte tunisien, avec traduction IA et images générées par Claude. --- ## 🗂️ Structure du projet ``` tunisian-app/ ├── netlify/ │ └── functions/ │ ├── claude-translate.js ← API traduction FR → Tunisien │ └── claude-image.js ← API génération SVG illustratif ├── src/ │ ├── main.jsx ← Point d'entrée React │ └── App.jsx ← Application complète ├── index.html ├── vite.config.js ├── package.json └── netlify.toml ``` --- ## 🚀 Déploiement sur Netlify ### Étape 1 — Prérequis - Compte Netlify (gratuit) - Compte Anthropic avec une clé API - Node.js ≥ 18 installé ### Étape 2 — Installer les dépendances ```bash npm install ``` ### Étape 3 — Déployer sur Netlify **Option A — Via l'interface Netlify (recommandé)** 1. Va sur app.netlify.com 2. Clique **"Add new site" → "Import an existing project"** 3. Connecte ton repo GitHub/GitLab contenant ce projet 4. Les paramètres de build sont déjà dans `netlify.toml` : - Build command : `npm run build` - Publish directory : `dist` 5. Clique **"Deploy site"** **Option B — Via CLI Netlify** ```bash npm install -g netlify-cli netlify login netlify init netlify deploy --prod ``` ### Étape 4 — Ajouter la clé API Claude ⚠️ OBLIGATOIRE Dans le dashboard Netlify de ton site : 1. Va dans **Site configuration → Environment variables** 2. Clique **"Add a variable"** 3. Ajoute : - **Key** : `ANTHROPIC_API_KEY` - **Value** : `sk-ant-api03-...` ← ta clé depuis console.anthropic.com 4. Clique **Save** 5. **Redéploie le site** (Deploys → Trigger deploy) --- ## 💻 Développement local Pour tester avec les fonctions Netlify en local : ```bash # Installe Netlify CLI npm install -g netlify-cli # Crée un fichier .env avec ta clé echo "ANTHROPIC_API_KEY=sk-ant-api03-..." > .env # Lance le serveur de dev Netlify (fonctions + frontend) netlify dev ``` L'app sera accessible sur `localhost` > ⚠️ …