TP pokédex SPA

Pré-requis :

• Avoir la dernière version LTS de NodeJS (ou à minima >=18)
• Avoir un compte sur Docker hub
• Avoir docker installé en local (Docker Desktop sur Windows est très bien)

Le TP se situe à l'adresse suivante : https://github.com/DwizN/template-tgc-spa

Utilisation de l'API hébergée

Voici deux liens vers l'API backend hébergée à ajouter dans vos fichiers .env, pour remplacer docker :

//.env
VITE_API_BASE_URL=https://api.aoffroy.dev/nodejs/but2/pokedex/api
VITE_SOCKET_URL=https://api.aoffroy.dev/nodejs/but2/pokedex/

En cas d'indisponibilité de l'API, vous pouvez utiliser :

https://tcg-api-csgd.onrender.com/api-docs/

Application Front-end attendue

https://app.aoffroy.dev/nodejs/but2/pokedex-front/

Aide Socket

Pour vous aider sur les sockets et pour vous faire gagner du temps, vous avez à disposition les types des interfaces présentes pour les websockets. Des console.log avec la structure sont présents dans l'application exemple.

// src/types/game.ts
export interface Card {
  id: number
  name: string
  hp: number
  attack: number
  type: string
  pokedexNumber: number
  imgUrl: string
}

export interface ActiveCard {
  id: number
  name: string
  hp: number
  currentHp: number
  attack: number
  type: string
  pokedexNumber: number
  imgUrl: string
}

export interface PlayerBoard {
  activeCard: ActiveCard | null
  hand: Card[]
  deck: Card[]
  score: number
}

export interface PlayerState {
  socketId: string
  board: PlayerBoard
}

export interface GameState {
  roomId: number
  status: string
  currentPlayerSocketId: string
  host: PlayerState
  guest: PlayerState
}

export interface RoomListItem {
  id: number
  hostSocketId: string
}

export interface RoomCreatedPayload {
  roomId: number
  message: string
}

export interface GameStartedPayload {
  message: string
  gameState: GameState
}

export interface GameStateUpdatedPayload {
  message: string
  gameState: GameState
}

export interface GameEndedPayload {
  winner: string
  message: string
}

export interface OpponentDisconnectedPayload {
  message: string
}

export interface ErrorPayload {
  message: string
}

export interface CreateRoomEvent {
  deckId: number
}

export interface JoinRoomEvent {
  roomId: number
  deckId: number
}

export interface DrawCardsEvent {
  roomId: number
}

export interface PlayCardEvent {
  roomId: number
  cardIndex: number
}

export interface AttackEvent {
  roomId: number
}

export interface EndTurnEvent {
  roomId: number
}