✏️

Pictionnary

Completed 2023 Client-Serveur (REST) avec Frontend SPA

Pictionnary est un jeu Pictionary en ligne full-stack. Le backend NestJS expose des API REST sécurisées JWT pour authentification, gestion de salles, mots, commentaires et historique, avec documentation Swagger et validation globale. Le frontend React fournit des flux login/register, création et rejoindre des salles, liste de joueurs et vues de salles. CORS est activé pour intégration SPA, et validation pilotée par DTO sécurise les entrées.

Développement de Jeux Développement Full-Stack Développement Web Ingénierie Logicielle

Aperçu

Pictionnary est un jeu Pictionary en ligne full-stack. Le backend NestJS expose des API REST sécurisées JWT pour authentification, gestion de salles, mots, commentaires et historique, avec documentation Swagger et validation globale. Le frontend React fournit des flux login/register, création et rejoindre des salles, liste de joueurs et vues de salles. CORS est activé pour intégration SPA, et validation pilotée par DTO sécurise les entrées.

Fonctionnalités clés

Authentification sécurisée JWT avec inscription/login

pages.portfolio.projects.pictionnary.features.1

CRUD de mots (picword) pour tours de jeu

Stockage et récupération d'historique pour scores

Module de commentaires pour contexte de collaboration de jeu

Documentation Swagger avec authentification bearer

Validation globale avec DTOs et ValidationPipe

API REST activée CORS pour SPA

SPA React avec routes pour login, register, créer/rejoindre salle et vue de salle

Helpers LocalStorage pour données JWT/session

Principales fonctionnalités

Construction d'API REST NestJS avec sécurité JWT, docs Swagger et conception DTO validation-first

Implémentation de modules salle, mot, historique, commentaire et utilisateur avec persistance MongoDB/Mongoose

Création de SPA React avec auth, flux création/rejoindre salle et liste de joueurs

Activation de CORS et Swagger authentifié bearer pour intégration et test SPA faciles

Défis et solutions

Routes Sécurisées JWT

Configuration de AuthGuard global avec passport-jwt et authentification bearer Swagger pour sécuriser les points de terminaison

Gestion d'Adhésion de Salle

Fourniture de points de terminaison pour créer/rejoindre des salles, récupérer des joueurs et générer des liens d'invitation

Validation et Application DTO

Utilisation de DTOs class-validator avec ValidationPipe global pour whitelist et valider les entrées

Intégration SPA

Activation de CORS et structuration de points de terminaison pour consommation SPA React fluide

Technologies

Backend

NestJS 10 TypeScript MongoDB Mongoose JWT Passport @nestjs/swagger Multer bcrypt

Frontend

React 18 (CRA) React Router 6 Tailwind config

Tooling

ESLint Prettier Jest Supertest

Informations du projet

Statut
Completed
Année
2023
Architecture
Client-Serveur (REST) avec Frontend SPA
Category
Développement de Jeux