projet_personnel_2026_arena_battle Svelte Themes

Projet_personnel_2026_arena_battle

Application web de combats au tour par tour - Svelte + Express + PostgreSQL (authentification, combats, persistance des données)

# Projet personnel 2026 - Arena Battle

Application web de combat tour par tour. Le joueur se connecte, choisit un personnage et lance un duel 1v1 contre un adversaire. Le moteur de combat gère tours, sorts, buffs, debuffs, effets négatifs et journaux de combat.

Démo : http://162.19.76.60/
Identifiants (compte de test) : demo / P@ssw0rd

Fonctionnalités

  • Protection CSRF via token dédié (cookie + en-tête sur les requêtes mutatives)
  • Authentification via JWT en cookie httpOnly (register, login, logout, session) + validation des payloads (Zod)
  • Sélection de personnages et démarrage de combat 1v1
  • Moteur de combat côté serveur (cooldowns, passifs, buffs, debuffs, effets négatifs)
  • Journaux de combat côté client
  • Persistance PostgreSQL (utilisateurs et combats)

Stack technique

  • Frontend: Svelte 5 + Vite
  • Backend: Node.js + Express
  • Base de données: PostgreSQL + Prisma

Architecture et flux

  • Le client appelle l'API via le proxy Vite (/api -> http://localhost:3000)
  • Le serveur expose les routes d'auth, de sélection et de combat
  • Les combats sont stockés dans la base de données (state, turn, data serialize)

Lancer en local

Prérequis

  • Node.js + npm
  • PostgreSQL

1) Configurer les variables d'environnement

Créer un fichier .env ou renommer le fichier .env.example dans server/:

NODE_ENV=dev
PORT=express_port
DATABASE_URL=postgres://user:password@localhost:5432/database
JWT_SECRET=jwt_secret
CSRF_SECRET=csrf_secret

2) Installer et initialiser le serveur

cd server
npm install
npm run db:migrate:dev
npm run dev

3) Installer et lancer le client

cd client
npm install
npm run dev

Ouvrir http://localhost:5173

Scripts utiles

  • server: npm run db:migrate:dev (applique les migrations (créer / met à jour les tables)), npm run dev
  • client: npm run dev, npm run build, npm run preview

API (extrait)

CSRF:

  • GET /api/csrf

Auth:

  • POST /api/auth/register
  • POST /api/auth/login
  • POST /api/auth/logout
  • GET /api/auth/me

Sélection:

  • GET /api/init
  • POST /api/create-battle

Combat:

  • GET /api/battle/:id
  • GET /api/battle/:id/turn/
  • PATCH /api/battle/:id/reduce-character-spells-cd
  • PATCH /api/battle/:id/check-character-negative-effect
  • PATCH /api/battle/:id/check-character-buffs
  • PATCH /api/battle/:id/check-character-debuffs
  • PATCH /api/battle/:id/passive-per-turn
  • GET /api/battle/:id/determine-player-action
  • GET /api/battle/:id/determine-enemy-action
  • PATCH /api/battle/:id/character-use-spell
  • PATCH /api/battle/:id/check-character-alive

Structure du projet

.
├─ client/                 # Svelte + Vite (UI)
├─ server/                 # Express + moteur de combat + Prisma
├─ conception/             # MCD / MLD / user stories
└─ README.md

Conception

  • conception/MCD.md
  • conception/MLD.md
  • conception/User_stories.md

Top categories

Loading Svelte Themes