🟦 Fullstack DataGrid

Fullstack DataGrid est une application web full-stack permettant d’interagir avec une grille de données dynamique.
L’objectif est de démontrer la communication entre un front-end React et un back-end Express, avec une persistance assurée par une base SQLite.

• ⚛️ Front-end développé avec React 19 et Vite 7
• 🟢 Back-end en Express.js utilisant better-sqlite3
• 💾 Persistance des données en base locale
• ⚙️ Communication via API REST

---

⚡ Fonctionnalités principales

Fonctionnalité	Description
🧱 Affichage de grille dynamique	Génère une grille 20x20 dont chaque cellule possède un état stocké côté serveur
🖱️ Interaction utilisateur	Clic sur une cellule pour modifier sa couleur ou son état
💾 Sauvegarde persistante	Les modifications sont sauvegardées dans la base SQLite
📡 API REST Express	GET /grid pour récupérer les données, POST /setGridColor pour les modifier
⚛️ Front-end réactif	Hooks React (useState, useEffect) pour la gestion d’état et le rendu dynamique

---

🔧 Stack technique

Côté	Technologies	Détail
Front-end	React 19, Vite 7	Interface réactive avec hooks et gestion d’état
Back-end	Express.js	API REST légère pour lecture/écriture des données
Base de données	better-sqlite3	Stockage local et persistant
Outils	Nodemon, Concurrently, ESLint	Développement fluide et contrôle qualité du code

---

🚀 Lancer le projet en local

📦 Prérequis

• Node.js ≥ 18.x (inclut npm ≥ 9.x)

🧪 Étapes

1. Cloner le repo

git clone https://github.com/Hamzael25/Fullstack-DataGrid.git
cd Fullstack-DataGrid

2. Installer les dépendances et lancer le serveur de dev

npm install && npm install --prefix server && npm install --prefix client
npm run dev