Cette mise à jour majeure transforme l'application en une plateforme complète de gestion de notes et de tâches avec de nombreuses nouvelles fonctionnalités. Nouvelles fonctionnalités: 1. **Éditeur de texte enrichi** - Barre d'outils complète avec formatage (gras, italique, souligné) - Support des titres (H1, H2, H3) - Listes à puces et numérotées - Alignement du texte (gauche, centre, droite) - Citations et blocs de code - Insertion de liens - Raccourcis clavier (Ctrl+B, Ctrl+I, Ctrl+U) 2. **Box Tâches globales (sidebar droite)** - Liste de tâches accessible depuis toute l'application - Ajout/suppression de tâches - Marquage des tâches comme complétées - Persistance des données 3. **Box Flux RSS (sidebar droite)** - Affichage des derniers articles RSS - Rafraîchissement manuel des flux - Ouverture des articles dans un nouvel onglet - Gestion des flux dans l'admin 4. **Support des fichiers joints dans les notes** - Upload de tous types de fichiers - Affichage de la taille des fichiers - Téléchargement et suppression des fichiers - Interface utilisateur intuitive 5. **Panel d'administration enrichi** - Onglet "Flux RSS" : gestion des flux RSS - Onglet "OpenRouter" : configuration de l'API IA - Onglet "Paramètres" : configuration de l'intervalle de rafraîchissement RSS - Interface organisée avec 4 onglets 6. **Amélioration de l'interface** - Layout à 3 colonnes responsive (Notes | Éditeur | Tâches+RSS) - Badges pour indiquer le nombre de tâches, images et fichiers par note - Design moderne et cohérent - Animations et transitions fluides 7. **Mise à jour de l'identité** - Nom de l'application : "NoteFlow" - Nouveau titre de page - Favicon SVG configuré - Logo mis à jour dans l'interface Services ajoutés: - RssService.ts : gestion des flux RSS et articles - TodosService.ts : gestion des tâches globales - SettingsService.ts : gestion des paramètres de l'application Composants ajoutés: - RichTextEditor.tsx : éditeur de texte enrichi avec barre d'outils Modifications techniques: - Ajout de la propriété "files" au type Note - Résolution du conflit de nommage avec Settings - Mise à jour de package.json avec la nouvelle description - Mise à jour de index.html avec favicon et titre Cette version représente une évolution majeure de l'application avec une expérience utilisateur nettement améliorée et de nombreuses fonctionnalités demandées.
📝 NoteFlow - Application de Notes et Todo List
Application web moderne de gestion de notes et de tâches, Dockerisée, avec authentification JWT, interface utilisateur fluide et animations CSS natives.
✨ Fonctionnalités
🔐 Authentification
- Connexion JWT sécurisée avec bcrypt
- Session de 24 heures
- Gestion des utilisateurs par les administrateurs
📝 Gestion des Notes
- Création, édition et suppression de notes
- Support des images (upload, preview, suppression)
- Todos intégrés dans les notes
- Recherche en temps réel par titre/contenu
- Interface masonry layout responsive
- Animations fluides sur les interactions
✅ Todos Globaux
- Sidebar permanente avec quick tasks
- Création, modification, suppression de todos
- Toggle completed/active
- Filtres : Toutes / Actives / Terminées
- Compteur de tâches restantes
👥 Administration
- Gestion des utilisateurs (création, modification, suppression)
- Attribution des droits administrateur
- Interface dédiée pour les admins
🛠️ Stack Technique
- Backend : Node.js 20 + Express
- Base de données : SQLite3
- Authentification : JWT + bcrypt
- Frontend : React 19 + TypeScript + Vite
- UI Components : shadcn/ui + Tailwind CSS
- Routing : React Router v7
- State Management : TanStack Query (React Query)
- Sécurité : Helmet.js, rate limiting, validation des entrées
- Logging : Winston
- Upload : Multer
- Container : Docker + Docker Compose
🚀 Installation et Démarrage
Prérequis
- Docker et Docker Compose installés
- Réseau Docker
nginx_default(ou adapter dans docker-compose.yml)
Installation
- Cloner le repository
git clone <repository-url>
cd noteflow
- Configurer les variables d'environnement
cp .env.example .env
Éditer le fichier .env :
PORT=2222
JWT_SECRET=<générer_une_clé_secrète_forte>
NODE_ENV=production
Générer un JWT_SECRET fort :
node -e "console.log(require('crypto').randomBytes(64).toString('hex'))"
- Builder et démarrer l'application
docker-compose up -d --build
- Accéder à l'application
http://localhost:2222
Identifiants par défaut
Username: admin
Password: admin
⚠️ IMPORTANT : Changez immédiatement le mot de passe admin en production !
🐳 Commandes Docker
# Démarrer
docker-compose up -d
# Arrêter
docker-compose down
# Rebuild
docker-compose build
# Logs
docker-compose logs -f
# Backup base de données (depuis le volume Docker)
docker cp notes-todo-app:/app/data/notes.db ./backup_$(date +%Y%m%d).db
# Restore base de données
docker cp ./backup_YYYYMMDD.db notes-todo-app:/app/data/notes.db
docker-compose restart
# Lister les volumes Docker
docker volume ls | grep notes
# Inspecter un volume
docker volume inspect noteflow_notes_data
# Supprimer les volumes (⚠️ supprime toutes les données)
docker-compose down -v
⚙️ Configuration Nginx
location /notes {
proxy_pass http://notes-todo-app:2222;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
client_max_body_size 10M;
}
📡 API Endpoints
Authentification
POST /api/auth/login
POST /api/auth/logout
GET /api/auth/me
Utilisateurs (Admin)
GET /api/users
POST /api/users
PUT /api/users/:id
DELETE /api/users/:id
Notes
GET /api/notes
POST /api/notes
GET /api/notes/:id
PUT /api/notes/:id
DELETE /api/notes/:id
POST /api/notes/:id/image
DELETE /api/notes/:id/image
GET /api/search?q=query
Todos Notes
POST /api/notes/:id/todos
PUT /api/notes/todos/:todoId
DELETE /api/notes/todos/:todoId
Todos Globaux
GET /api/todos
POST /api/todos
PUT /api/todos/:id
DELETE /api/todos/:id
🔒 Sécurité
- Bcrypt 12 rounds
- JWT expiration 24h
- Helmet.js
- Rate limiting
- Input validation
- File type whitelist
- SQL prepared statements
🔧 Dépannage
Erreur "no such column: n.image_filename"
Cette erreur survient lorsque la base de données a été créée avec une ancienne version du schéma.
Solution automatique (recommandée) : L'application détecte et ajoute automatiquement la colonne manquante au démarrage. Redéployez simplement :
docker-compose down
docker-compose up -d --build
Solution manuelle : Si nécessaire, vous pouvez appliquer la migration manuellement :
docker exec notes-todo-app sh /app/migrations/run-migrations.sh
Erreur de permissions sur les volumes Docker
Si vous rencontrez des erreurs SQLITE_CANTOPEN ou EACCES, recréez les volumes :
docker-compose down -v
docker-compose up -d --build
⚠️ Attention : Cela supprimera toutes les données existantes.
L'application ne démarre pas
Vérifiez les logs :
docker-compose logs -f notes-todo-app
📝 Licence
MIT