Sandpiles

Piattaforma per gioco competitivo da 2 giocatori

Funzionalità:

• Creazione account
• Partita PVP
• Partita PVE
• Visualizzare classifica

Design:

• Mockup
• Tech stack MEVN
• Sockets/REST API

Mockup

Mockup con figma:

Mockup

Mockup con figma:

Tech Stack

• MongoDB come database
• Express per il backend
• Vue per il frontend
• Typescript
• Scss
• MDBootstrap
• Jest per test backend
• Docker per containerizzazione e deployment
• Prolog per AI

Sockets/Rest API

• Tutte le api sono sotto il subdomain /account
• Account:
  • POST /register: registra un nuovo account
  • POST /login: consente l'accesso ad un utente già registrato
  • POST /logout: invalida l'access token dell'utente
  • GET /me: restituisce i dati utente (estratti dal token)
  • emit('deleteAccount'): elimina l'account

Sockets/Rest API

• Matchmaking:
  • Client:
    • emit('requestMatch'): Richiesta partita PVP
    • emit('requestMatchWithBot'): Richiesta partita PVE
  • Server:
    • emit('matchFound', { matchId: string }): Notifica partita trovata

Sockets/Rest API

• Match:
  • Client:
    • emit('getMatch'): Richiesta stato partita
    • emit('addMove'): Invia mossa
    • emit('matchHistory', <username>): Richiesta cronologia partite
  • Server:
    • emit('move'): Notifica mossa eseguita
    • emit('over'): Notifica partita finita

Sockets/Rest API

• Namespaces per determinare accesso a 'endpoint'
• Rooms per giocatori in partita
• Middleware per auth

Ux

Considerate le Euristiche di Nielsen:

• Pro:
  • Stile coerente
  • Linguaggio standardizzato
  • Tutorial Sandpiles
  • Navigabilità buona
• Contro:
  • Un solo modo per fare le cose
  • Documentazione su utilizzo sito scarna

Dettagli

• Cookies per autologin
• Matchmaking
• Salt e hash password in DB
• Responsive Design

Idee per il futuro

• Username non univoci
• Cronometro per le partite
• Replay history partite
• Pagina guida per l'utente