docs: update README with revised architecture and setup instructions

Streamlined project structure documentation by detailing separate backend and frontend directories, updated setup commands, added Docker usage examples, and improved clarity on environment configuration.
This commit is contained in:
Mathis H (Avnyr) 2025-05-15 18:17:18 +02:00
parent b64a6e9e2e
commit 4dbb858782

100
README.md
View File

@ -57,18 +57,23 @@ Cette application permet aux utilisateurs de créer et gérer des groupes de per
## 🏗️ Architecture Technique ## 🏗️ Architecture Technique
L'application suit une architecture monorepo avec séparation claire entre le frontend et le backend: L'application suit une architecture avec séparation claire entre le frontend et le backend:
``` ```
/ /
├── apps/ ├── backend/ # Application backend NestJS
│ ├── web/ # Application frontend NextJS │ ├── src/ # Code source du backend
│ └── api/ # Application backend NestJS │ │ ├── database/ # Configuration et schéma de base de données
├── packages/ # Packages partagés │ │ │ ├── migrations/ # Système de migrations de base de données
│ ├── database/ # Configuration DrizzleORM et modèles │ │ │ └── schema/ # Schéma de base de données avec DrizzleORM
│ ├── eslint-config/ # Configuration ESLint partagée │ │ └── modules/ # Modules NestJS (auth, users, projects, etc.)
│ ├── tsconfig/ # Configuration TypeScript partagée │ └── drizzle.config.ts # Configuration de DrizzleORM pour les migrations
│ └── ui/ # Bibliothèque de composants UI partagés ├── frontend/ # Application frontend NextJS
│ ├── app/ # Pages et routes Next.js (App Router)
│ ├── components/ # Composants UI réutilisables
│ ├── hooks/ # Hooks React personnalisés
│ └── lib/ # Utilitaires et configurations
├── docs/ # Documentation du projet
``` ```
### Flux d'Interactions ### Flux d'Interactions
@ -152,49 +157,66 @@ flowchart TD
# Cloner le dépôt # Cloner le dépôt
git clone git@git.yidhra.fr:WorkSimplon/brief-20.git git clone git@git.yidhra.fr:WorkSimplon/brief-20.git
# Installer pnpm si ce n'est pas déjà fait # Installer les dépendances du backend
npm install -g pnpm cd backend
npm install
# Installer les dépendances # Configurer les variables d'environnement du backend
pnpm install
# Configurer les variables d'environnement
cp .env.example .env cp .env.example .env
# Éditer le fichier .env avec vos propres valeurs # Éditer le fichier .env avec vos propres valeurs
# Démarrer l'application en mode développement # Installer les dépendances du frontend
pnpm dev cd ../frontend
npm install
# Construire l'application pour la production # Configurer les variables d'environnement du frontend (si nécessaire)
pnpm build cp .env.example .env.local (si le fichier existe)
# Éditer le fichier .env.local avec vos propres valeurs
# Démarrer l'application en mode production # Démarrer le backend en mode développement
pnpm start cd ../backend
npm run start:dev
# Dans un autre terminal, démarrer le frontend en mode développement
cd ../frontend
npm run dev
``` ```
### Gestion du Workspace avec PNPM Vous pouvez également utiliser Docker pour démarrer l'application complète :
Ce projet utilise PNPM pour la gestion du workspace et des packages. PNPM offre plusieurs avantages :
- **Efficacité de stockage** : Utilise un stockage partagé pour éviter la duplication des packages
- **Gestion de monorepo** : Facilite la gestion des dépendances entre les packages du monorepo
- **Performance** : Installation et mise à jour des dépendances plus rapides
- **Déterminisme** : Garantit que les mêmes dépendances sont installées de manière cohérente
Pour travailler avec les différents packages du monorepo :
```bash ```bash
# Exécuter une commande dans un package spécifique # À la racine du projet
pnpm --filter <package-name> <command> docker-compose up -d
```
# Exemple : démarrer le frontend uniquement ### Gestion des Projets Backend et Frontend
pnpm --filter web dev
# Installer une dépendance dans un package spécifique Ce projet est organisé en deux applications distinctes (backend et frontend) qui peuvent être développées et déployées séparément. Chaque application a ses propres dépendances et scripts npm.
pnpm --filter <package-name> add <dependency>
# Installer une dépendance de développement dans un package spécifique Pour travailler avec les projets backend et frontend séparément :
pnpm --filter <package-name> add -D <dependency>
```bash
# Naviguer vers le répertoire backend
cd backend
# Démarrer le backend en mode développement
npm run start:dev
# Naviguer vers le répertoire frontend
cd ../frontend
# Démarrer le frontend en mode développement
npm run dev
```
Vous pouvez également utiliser Docker Compose pour démarrer l'ensemble de l'application :
```bash
# Démarrer tous les services (backend, frontend, base de données)
docker-compose up -d
# Arrêter tous les services
docker-compose down
``` ```
## 🔒 Sécurité et Conformité ## 🔒 Sécurité et Conformité