Merge pull request #1 from itsSkycel/claude/write-project-readme-V6vnv

📝 Docs: Rédaction README complet avec méthode B-MAD

README.md

@@ -1,3 +1,202 @@
-# Portfolio-Skycel
+# Portfolio Développeur Web - Skycel
 
-Dépot de mon site portfolio personnel en tant que développeur web.
+Un portfolio moderne et responsive développé en PHP et Tailwind CSS, présentant mes projets, compétences et parcours en tant que développeur web full-stack.
+
+## 🎯 À propos de ce projet
+
+Ce projet a été réalisé comme **test d'application de la méthode B-MAD** (Build with Minimal Autonomous Direction) avec **ClaudeCode**, une approche innovante pour le développement assisté par IA.
+
+La méthode B-MAD permet de créer des applications complètes en définissant des stories structurées et en laissant l'IA gérer l'implémentation technique de manière autonome.
+
+🔗 **En savoir plus sur la méthode B-MAD** : [B-MAD Framework sur GitHub](https://github.com/gclaudedev/b-mad-framework)
+
+## ✨ Fonctionnalités
+
+- **Page d'accueil** : Hero section avec présentation et navigation rapide
+- **Projets** : Galerie de projets avec fiches détaillées (contexte, solution, technologies, captures d'écran)
+- **Compétences** : Présentation des technologies maîtrisées
+- **À propos** : Parcours et motivations
+- **Contact** : Formulaire de contact
+- **Responsive Design** : Interface optimisée pour mobile, tablette et desktop
+- **Navigation fluide** : Menu burger mobile et navbar responsive
+- **Routing personnalisé** : Système de routing PHP avec URLs propres
+
+## 🛠️ Stack Technique
+
+### Backend
+- **PHP 8.0+** : Langage principal
+- **Router personnalisé** : Gestion des routes sans framework
+- **Composer** : Gestionnaire de dépendances
+
+### Frontend
+- **Tailwind CSS 3.4** : Framework CSS utility-first
+- **JavaScript Vanilla** : Interactivité (menu mobile, animations)
+- **Design System** : Variables CSS personnalisées pour le theming
+
+### Données
+- **JSON** : Stockage des données de projets
+- **Structure modulaire** : Séparation templates/pages/includes
+
+### Outils
+- **Git** : Versioning
+- **npm** : Scripts de build pour Tailwind
+- **Apache/Nginx** : Serveur web avec URL rewriting
+
+## 📁 Structure du Projet
+
+```
+ClaudeCode-Portfolio/
+├── assets/
+│   ├── css/              # Styles Tailwind (input/output)
+│   ├── images/           # Images et assets
+│   └── js/               # Scripts JavaScript
+├── data/
+│   └── projects.json     # Données des projets
+├── includes/
+│   ├── functions.php     # Fonctions helpers
+│   └── router.php        # Système de routing
+├── pages/
+│   ├── home.php          # Page d'accueil
+│   ├── projects.php      # Liste des projets
+│   ├── project-single.php # Détail d'un projet
+│   ├── skills.php        # Compétences
+│   ├── about.php         # À propos
+│   ├── contact.php       # Contact
+│   └── 404.php           # Page d'erreur
+├── templates/
+│   ├── header.php        # En-tête HTML
+│   ├── navbar.php        # Barre de navigation
+│   ├── footer.php        # Pied de page
+│   └── project-card.php  # Composant carte projet
+├── index.php             # Front controller
+├── .htaccess             # Configuration Apache
+├── nginx.conf.example    # Configuration Nginx
+├── composer.json         # Dépendances PHP
+└── package.json          # Dépendances npm
+```
+
+## 🚀 Installation
+
+### Prérequis
+
+- PHP 8.0 ou supérieur
+- Composer
+- Node.js et npm
+- Serveur web (Apache ou Nginx)
+
+### Étapes
+
+1. **Cloner le dépôt**
+   ```bash
+   git clone https://github.com/Skycel9/Portfolio.git
+   cd Portfolio
+   ```
+
+2. **Installer les dépendances PHP**
+   ```bash
+   composer install
+   ```
+
+3. **Installer les dépendances npm**
+   ```bash
+   npm install
+   ```
+
+4. **Configurer l'environnement**
+   ```bash
+   cp .env.example .env
+   # Éditer .env avec vos paramètres
+   ```
+
+5. **Compiler Tailwind CSS**
+   ```bash
+   # Mode développement (watch)
+   npm run dev
+
+   # Mode production (minifié)
+   npm run build
+   ```
+
+6. **Configurer le serveur web**
+
+   **Apache** : Le fichier `.htaccess` est déjà configuré
+
+   **Nginx** : Utiliser `nginx.conf.example` comme base
+
+7. **Accéder au site**
+   ```
+   http://localhost/Portfolio
+   ```
+
+## 🎨 Personnalisation
+
+### Modifier les projets
+
+Éditer le fichier `data/projects.json` pour ajouter/modifier vos projets :
+
+```json
+{
+  "id": 1,
+  "title": "Titre du projet",
+  "slug": "url-friendly-slug",
+  "category": "vedette",
+  "thumbnail": "image-thumb.webp",
+  "url": "https://projet-demo.com",
+  "github": "https://github.com/user/repo",
+  "technologies": ["PHP", "React", "MySQL"],
+  "context": "Description du contexte...",
+  "solution": "Description de la solution...",
+  "teamwork": "Informations sur le travail d'équipe",
+  "duration": "2 mois",
+  "screenshots": ["screen-1.webp", "screen-2.webp"]
+}
+```
+
+### Personnaliser les couleurs
+
+Modifier le fichier `tailwind.config.js` pour changer le thème de couleurs.
+
+### Modifier le contenu
+
+Les pages sont dans le dossier `pages/`. Modifier directement le HTML/PHP selon vos besoins.
+
+## 📝 Scripts disponibles
+
+```bash
+npm run dev      # Compiler Tailwind en mode watch
+npm run build    # Compiler Tailwind en mode production
+```
+
+## 🔧 Configuration Serveur
+
+### Apache
+
+Le fichier `.htaccess` gère automatiquement le URL rewriting.
+
+### Nginx
+
+Utiliser la configuration du fichier `nginx.conf.example` :
+- Redirection de toutes les requêtes vers `index.php`
+- Gestion des fichiers statiques
+- Headers de sécurité
+
+## 📄 Licence
+
+Ce projet est sous licence ISC. Voir le fichier [LICENSE](LICENSE) pour plus de détails.
+
+## 👤 Auteur
+
+**Skycel9**
+
+- GitHub : [@Skycel9](https://github.com/Skycel9)
+- Portfolio : [Skycel9/Portfolio](https://github.com/Skycel9/Portfolio)
+
+## 🙏 Remerciements
+
+- **ClaudeCode** pour l'assistance au développement via la méthode B-MAD
+- **Tailwind CSS** pour le framework CSS
+- La communauté open source pour les outils utilisés
+
+---
+
+*Développé avec ❤️ et la méthode B-MAD*