# garenaud/transcendence architecture

> Architecture diagram of the GitHub repository garenaud/transcendence, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/garenaud/transcendence
- Repository: https://github.com/garenaud/transcendence

## Overview

ft_transcendence combines a Django API and WebSocket backend, a JavaScript single-page frontend, and a Rust terminal client. The main web workflow is user authentication and profile management, followed by Pong matchmaking or tournament play; live game/chat events and match records are handled server-side. README-described features such as friends, dashboards, custom games, AI, and blockchain scoring are not all verifiable in the sampled code, so those links are omitted or shown as unverified.

Main entry points: [`frontend/srcs/components/pongComponent.js`](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/pongComponent.js) (Pong controls), [`backend/database/models.py`](https://github.com/garenaud/transcendence/blob/main/backend/database/models.py) (Game and user data), [`cli/src/main.rs`](https://github.com/garenaud/transcendence/blob/main/cli/src/main.rs) (Rust terminal client), [`frontend/srcs/components/stateManager.js`](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/stateManager.js) (SPA routing)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Web frontend"]
  node_spa["SPA routing<br/>[stateManager.js]"]
  node_loginui["Login UI<br/>[login.js]"]
  node_profileui["Profile and friends<br/>[navbar.js]"]
  node_usermgr["User manager<br/>[userManager.js]"]
  node_pongui["Pong controls<br/>[pongComponent.js]"]
  node_tournamentui["Tournament menu<br/>[tournament_menu.js]"]
  node_chatui["Chat tools<br/>[chatTools.js]"]
end

subgraph group_backend["Django backend"]
  node_api["API views<br/>[views.py]"]
  node_auth["Login and auth<br/>[views.py]"]
  node_models[("Game and user data<br/>[models.py]")]
  node_serializers["API serializers<br/>[serializers.py]"]
  node_wsroutes["WebSocket routing<br/>[routing.py]"]
  node_chatws["Chat WebSockets<br/>[consumers.py]"]
  node_asgi["ASGI entry<br/>[asgi.py]"]
end

subgraph group_gameplay["Game services"]
  node_pongengine["Browser Pong<br/>[pong.js]"]
  node_localpong["Local Pong<br/>[localpong.js]"]
  node_gamews["Game WebSockets<br/>[consumers.py]"]
end

subgraph group_cli["Terminal client"]
  node_cli["Rust terminal client<br/>[main.rs]"]
  node_clilogin["CLI login<br/>[login.rs]"]
  node_cliuser["CLI user session<br/>[user.rs]"]
  node_clipong["CLI Pong<br/>[pong.rs]"]
  node_clitournament["CLI tournaments<br/>[tournament.rs]"]
end

node_browser(("Player browser"))
node_external["42 OAuth provider"]
node_blockchain["Ethereum network"]

node_browser -->|"uses"| node_spa
node_spa -->|"renders"| node_loginui
node_spa -->|"renders"| node_pongui
node_spa -->|"loads user"| node_usermgr
node_loginui -.->|"authenticates via API"| node_auth
node_profileui -->|"updates profile"| node_usermgr
node_usermgr -.->|"requests API data"| node_api
node_api -->|"reads and writes"| node_models
node_api -->|"serializes"| node_serializers
node_serializers -->|"maps models"| node_models
node_auth -->|"uses user data"| node_models
node_pongui -->|"opens tournament"| node_tournamentui
node_pongui -->|"starts game"| node_pongengine
node_pongui -.->|"joins online play"| node_gamews
node_pongui -.->|"offers local play"| node_localpong
node_wsroutes -->|"routes game sockets"| node_gamews
node_wsroutes -.->|"routes chat sockets"| node_chatws
node_asgi -->|"loads routes"| node_wsroutes
node_gamews -->|"uses game data"| node_models
node_chatui -.->|"exchanges messages"| node_chatws
node_cli -->|"logs in"| node_clilogin
node_cli -->|"holds session"| node_cliuser
node_cli -->|"opens Pong"| node_clipong
node_cli -->|"opens tournaments"| node_clitournament
node_clipong -.->|"uses game socket"| node_gamews
node_clilogin -->|"fills session"| node_cliuser
node_external -.->|"OAuth integration"| node_auth
node_models -.->|"score storage"| node_blockchain

click node_spa "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/stateManager.js"
click node_loginui "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/login.js"
click node_profileui "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/navbar.js"
click node_usermgr "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/userManager.js"
click node_pongui "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/pongComponent.js"
click node_pongengine "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/pong/javascript/pong.js"
click node_localpong "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/localpong/localpong.js"
click node_tournamentui "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/tournament_menu.js"
click node_chatui "https://github.com/garenaud/transcendence/blob/main/frontend/srcs/chatTools.js"
click node_api "https://github.com/garenaud/transcendence/blob/main/backend/api/views.py"
click node_auth "https://github.com/garenaud/transcendence/blob/main/backend/login/views.py"
click node_models "https://github.com/garenaud/transcendence/blob/main/backend/database/models.py"
click node_serializers "https://github.com/garenaud/transcendence/blob/main/backend/database/serializers.py"
click node_gamews "https://github.com/garenaud/transcendence/blob/main/backend/game/consumers.py"
click node_wsroutes "https://github.com/garenaud/transcendence/blob/main/backend/game/routing.py"
click node_chatws "https://github.com/garenaud/transcendence/blob/main/backend/main/consumers.py"
click node_asgi "https://github.com/garenaud/transcendence/blob/main/backend/transcendence/asgi.py"
click node_cli "https://github.com/garenaud/transcendence/blob/main/cli/src/main.rs"
click node_clilogin "https://github.com/garenaud/transcendence/blob/main/cli/src/login.rs"
click node_cliuser "https://github.com/garenaud/transcendence/blob/main/cli/src/user.rs"
click node_clipong "https://github.com/garenaud/transcendence/blob/main/cli/src/pong.rs"
click node_clitournament "https://github.com/garenaud/transcendence/blob/main/cli/src/tournament.rs"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_spa,node_loginui,node_profileui,node_usermgr,node_pongui,node_tournamentui,node_chatui,node_browser toneBlue
class node_api,node_auth,node_models,node_serializers,node_wsroutes,node_chatws,node_asgi toneAmber
class node_pongengine,node_localpong,node_gamews toneMint
class node_cli,node_clilogin,node_cliuser,node_clipong,node_clitournament toneRose
class node_external,node_blockchain toneIndigo
```

## Components

### Web frontend

- [SPA routing](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/stateManager.js): `frontend/srcs/components/stateManager.js`
- [Login UI](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/login.js): `frontend/srcs/components/login.js`
- [Profile and friends](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/navbar.js): `frontend/srcs/components/navbar.js`
- [User manager](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/userManager.js): `frontend/srcs/components/userManager.js`
- [Pong controls](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/pongComponent.js): `frontend/srcs/components/pongComponent.js`
- [Tournament menu](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/components/tournament_menu.js): `frontend/srcs/components/tournament_menu.js`
- [Chat tools](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/chatTools.js): `frontend/srcs/chatTools.js`

### Django backend

- [API views](https://github.com/garenaud/transcendence/blob/main/backend/api/views.py): `backend/api/views.py`
- [Login and auth](https://github.com/garenaud/transcendence/blob/main/backend/login/views.py): `backend/login/views.py`
- [Game and user data](https://github.com/garenaud/transcendence/blob/main/backend/database/models.py): `backend/database/models.py`
- [API serializers](https://github.com/garenaud/transcendence/blob/main/backend/database/serializers.py): `backend/database/serializers.py`
- [WebSocket routing](https://github.com/garenaud/transcendence/blob/main/backend/game/routing.py): `backend/game/routing.py`
- [Chat WebSockets](https://github.com/garenaud/transcendence/blob/main/backend/main/consumers.py): `backend/main/consumers.py`
- [ASGI entry](https://github.com/garenaud/transcendence/blob/main/backend/transcendence/asgi.py): `backend/transcendence/asgi.py`

### Game services

- [Browser Pong](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/pong/javascript/pong.js): `frontend/srcs/pong/javascript/pong.js`
- [Local Pong](https://github.com/garenaud/transcendence/blob/main/frontend/srcs/localpong/localpong.js): `frontend/srcs/localpong/localpong.js`
- [Game WebSockets](https://github.com/garenaud/transcendence/blob/main/backend/game/consumers.py): `backend/game/consumers.py`

### Terminal client

- [Rust terminal client](https://github.com/garenaud/transcendence/blob/main/cli/src/main.rs): `cli/src/main.rs`
- [CLI login](https://github.com/garenaud/transcendence/blob/main/cli/src/login.rs): `cli/src/login.rs`
- [CLI user session](https://github.com/garenaud/transcendence/blob/main/cli/src/user.rs): `cli/src/user.rs`
- [CLI Pong](https://github.com/garenaud/transcendence/blob/main/cli/src/pong.rs): `cli/src/pong.rs`
- [CLI tournaments](https://github.com/garenaud/transcendence/blob/main/cli/src/tournament.rs): `cli/src/tournament.rs`

### Other components

- **Player browser**
- **42 OAuth provider**
- **Ethereum network**

## Connections

- Player browser → SPA routing: uses
- SPA routing → Login UI: renders (evidence: `frontend/srcs/components/stateManager.js`)
- SPA routing → Pong controls: renders (evidence: `frontend/srcs/components/stateManager.js`)
- SPA routing → User manager: loads user (evidence: `frontend/srcs/components/stateManager.js`)
- Login UI → Login and auth: authenticates via API
- Profile and friends → User manager: updates profile (evidence: `frontend/srcs/components/navbar.js`)
- User manager → API views: requests API data
- API views → Game and user data: reads and writes (evidence: `backend/api/views.py`)
- API views → API serializers: serializes (evidence: `backend/api/views.py`)
- API serializers → Game and user data: maps models (evidence: `backend/database/serializers.py`)
- Login and auth → Game and user data: uses user data (evidence: `backend/login/views.py`)
- Pong controls → Tournament menu: opens tournament (evidence: `frontend/srcs/components/pongComponent.js`)
- Pong controls → Browser Pong: starts game (evidence: `frontend/srcs/components/pongComponent.js`)
- Pong controls → Game WebSockets: joins online play
- Pong controls → Local Pong: offers local play (evidence: `frontend/srcs/localpong/localpong.js`)
- WebSocket routing → Game WebSockets: routes game sockets (evidence: `backend/game/routing.py`)
- WebSocket routing → Chat WebSockets: routes chat sockets
- ASGI entry → WebSocket routing: loads routes (evidence: `backend/transcendence/asgi.py`)
- Game WebSockets → Game and user data: uses game data (evidence: `backend/game/consumers.py`)
- Chat tools → Chat WebSockets: exchanges messages
- Rust terminal client → CLI login: logs in (evidence: `cli/src/main.rs`)
- Rust terminal client → CLI user session: holds session (evidence: `cli/src/main.rs`)
- Rust terminal client → CLI Pong: opens Pong (evidence: `cli/src/main.rs`)
- Rust terminal client → CLI tournaments: opens tournaments (evidence: `cli/src/main.rs`)
- CLI Pong → Game WebSockets: uses game socket
- CLI login → CLI user session: fills session (evidence: `cli/src/login.rs`)
- 42 OAuth provider → Login and auth: OAuth integration
- Game and user data → Ethereum network: score storage