8.8 KiB
8.8 KiB
📚 StripStream - Devbook
🎯 Objectifs
Application web moderne pour la lecture de BD/mangas/comics via un serveur Komga.
🚀 Fonctionnalités à venir
📚 Gestion des séries
- Système de favoris
- Service de gestion des favoris
- Bouton d'ajout/retrait des favoris
- Menu dédié dans la sidebar avec la liste des séries favorites
- Carousel dédié dans sur la homepage de toutes les séries favorites
- Vue liste/grille
- Filtres et tri avancés
- Recherche globale
- Bouton pour marquer comme lu
📖 Lecteur
- Navigation entre les pages
- Touches clavier (flèches, espace)
- Swipe sur mobile
- Boutons de navigation
- Mode double page
- Détection automatique en paysage
- Toggle manuel
- Gestion des spreads
- Préchargement des pages
- Cache des pages adjacentes
- Nettoyage automatique du cache
- Améliorations des thumbnails
- Prefetch en 2 secondes
- UI : barre de scroll plus grande
- UI : scroll horizontal
- Revue API thumbnail
- Navigation avancée
- Page fantôme avant le lecteur
- Switch to page direct
📖 Lecture
- Téléchargement local des livres
- Bouton de téléchargement
- Gestion de la progression
- Stockage local sécurisé
- Bouton pour supprimer le téléchargement
- Bouton pour supprimer tous les livres téléchargés dans les préférences
- Support de nouveaux formats
- EPUB
🔄 Cache et Performance
- Revoir si tous les services utilisent bien le cache
- Invalidation du cache sur les mutations
- Stratégie de revalidation à la demande
- Prefetching intelligent
- Lazy loading amélioré
👥 Gestion des utilisateurs
- Système d'inscription
- Profil utilisateur enrichi
- Nom/Prénom
- Préférences personnalisées
- Gestion des rôles et permissions
🌍 Internationalisation
- Support multi-langues
- i18n
- RTL support
🧪 Tests
- Tests unitaires
- Services
- Hooks
- Utils
- Tests d'intégration
- Flows utilisateur
- API integration
- Tests E2E
- User journeys
- Cross-browser
📝 Documentation
- README
- Installation
- Configuration
- Development
- Guide d'utilisation
- Features
- Shortcuts
- Tips & tricks
- Documentation API
- Endpoints
- Types
- Examples
🚀 Déploiement
- Configuration du build
- Optimisations de build
- Analyse de bundle
- Scripts de déploiement
- CI/CD
- Environnements
- Documentation d'installation
- Requirements
- Step-by-step guide
📋 Fonctionnalités principales
🔐 Authentification et Configuration
- Interface de connexion
- Formulaire de connexion
- Déconnexion
- Page de paramétrage pour la configuration Komga
- Configuration du serveur
- Test de connexion
- Gestion du cache
📚 Bibliothèque
- Visualisation et navigation
- Liste des bibliothèques
- Affichage des séries par bibliothèque
- Couvertures et informations des séries
- Pagination
- Statut de lecture avec transparence pour les éléments lus
- Informations au survol
📖 Lecteur
- Lecteur de fichiers (CBZ, CBR)
- Navigation entre les pages
- Mode plein écran
- Raccourcis clavier
- Mode double page
- Zoom et pan
- Préchargement des pages
📱 PWA
- Installation
- Manifest
- Service worker
- Icons
- Splash screens
- Mode hors ligne
- Offline page
- Cache stratégies
- Background sync
- Support iOS
- Configurations spécifiques
- Splash screens iOS
- Status bar
🎨 UI/UX
- Design responsive
- Mobile-first
- Breakpoints cohérents
- Touch-friendly
- Animations et transitions
- Page transitions
- Loading states
- Micro-interactions
- Feedback utilisateur
- Toasts pour les actions
- Messages d'erreur contextuels
- Indicateurs de progression
- États de chargement
- Skeletons
- Suspense boundaries
- Loading spinners
- Gestion des erreurs UI
- Error boundaries
- Fallbacks élégants
- Recovery options
🔍 Optimisations
- Performance
- Optimisation des images
- Format WebP
- Responsive images
- Lazy loading
- Components
- Images
- Routes
- Mise en cache
- API responses
- Static assets
- Images
- Optimisation des images
- SEO
- Meta tags
- Sitemap
- robots.txt
- Accessibilité
- ARIA labels
- Keyboard navigation
- Screen readers
- Color contrast
🛠 Configuration initiale
- Mise en place du projet Next.js
- Configuration TypeScript
- Configuration ESLint et Prettier
- Configuration Tailwind CSS
- Configuration des alias de chemins
- Mise en place de l'authentification
- Configuration du stockage sécurisé des credentials
- Service de stockage avec localStorage/sessionStorage
- Encodage basique des données sensibles
- Gestion des cookies pour le middleware
- Middleware d'authentification (protection des routes)
- Protection des routes publiques/privées
- Redirection vers la page de login
- Gestion des routes d'API
- Configuration du stockage sécurisé des credentials
- Configuration des variables d'environnement
- Création du fichier .env.local.example
- URL de l'application
- URL par défaut du serveur Komga
- Version de l'application
- Types pour les variables d'environnement
- Déclaration des types ProcessEnv
- Variables publiques (NEXTPUBLIC*)
- Création du fichier .env.local.example
📚 Structure de l'application
- Mise en place de l'architecture des dossiers
- Components
- Layouts
- Pages (routes)
- Services (API)
- Types
- Hooks personnalisés
- Utils
- Création des types TypeScript
- Types pour l'API Komga
- Types des utilisateurs et rôles
- Types des bibliothèques
- Types des séries et livres
- Types des métadonnées
- Types pour les états d'authentification
- Configuration d'authentification
- État d'authentification
- Gestion des erreurs
- Types pour les préférences utilisateur
- Types pour l'API Komga
🔄 Intégration Komga
- Service d'API
- Client HTTP avec fetch natif
- Gestion des tokens Basic Auth
- Cache des requêtes
- Gestion des erreurs
- Typage des réponses
- Endpoints
- Authentification
- Collections
- Séries
- Tomes
- Progression de lecture
- Images et miniatures
Gestion des séries
- Système de favoris (ajout/retrait d'une série des favoris)
🔐 Authentification et Sécurité
- Renforcement de la sécurité
- Implémentation des JWT
- Tokens d'accès et de rafraîchissement
- Rotation des clés de signature
- Sécurisation des cookies
- Flags HttpOnly, Secure, SameSite
- Chiffrement des données sensibles
- Gestion des sessions
- Table de sessions en base de données
- Détection des connexions simultanées
- Système "Se souvenir de moi"
- Protection contre les attaques
- Rate limiting
- Protection CSRF
- Validation des entrées avec Zod
- Audit et logging
- Journalisation des connexions
- Alertes de sécurité
- Implémentation des JWT
🎨 UI/UX
- Composants de base
- Boutons et inputs
- Cards et grilles
- Modals et popovers
- Navigation
- Sidebar responsive
- Breadcrumbs
- Menu utilisateur
- Thèmes
- Mode sombre/clair
- Thèmes personnalisés
- Persistance des préférences
🔍 Performance
- Optimisation des images
- Format WebP
- Tailles responsives
- Lazy loading
- Cache
- Stratégies par type de contenu
- Invalidation intelligente
- Prefetching sélectif
- Métriques
- Core Web Vitals
- Analytics de performance
- Monitoring des erreurs
📊 Analytics et Monitoring
- Tracking utilisateur
- Pages vues
- Temps de lecture
- Interactions clés
- Monitoring technique
- Logs d'erreurs
- Métriques de performance
- Alertes
🔄 Intégration Continue
- Tests automatisés
- Tests unitaires
- Tests d'intégration
- Tests E2E
- Pipeline CI/CD
- Build et tests
- Déploiement automatique
- Environnements de staging