# palanoyz/cinemahub architecture

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

- Interactive diagram: https://gitdiagram.com/palanoyz/cinemahub
- Repository: https://github.com/palanoyz/cinemahub

## Overview

CinemaHub is a full-stack cinema ticketing system. The main customer flow is browsing movies and showtimes, authenticating, selecting and locking seats, confirming a booking, then viewing tickets; seat updates are broadcast live and confirmed bookings are processed asynchronously. The graph preserves the documented admin, distributed-locking, and background-processing capabilities. Backend wiring is only partly sampled, so documented relationships are cited to the README; uncertain implementation-level calls are omitted.

Main entry points: [`Frontend/src/router/index.ts`](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/router/index.ts) (Route access), [`Backend/internal/handler`](https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/handler) (HTTP handlers), [`Frontend/src/services/api.ts`](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/services/api.ts) (HTTP API client), [`Frontend/src/stores/auth.ts`](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/stores/auth.ts) (Auth state)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Customer application"]
  node_frontend["Vue application<br/>[App.vue]"]
  node_routing["Route access<br/>[index.ts]"]
  node_authviews["Login and signup<br/>[LoginView.vue]"]
  node_authstore["Auth state<br/>[auth.ts]"]
  node_firebaseclient["Firebase client<br/>[firebase.ts]"]
  node_catalog["Movie browsing<br/>[HomeView.vue]"]
  node_moviedetail["Movie and showtimes"]
  node_seatui["Seat selection"]
  node_ticketsui["Customer tickets<br/>[TicketView.vue]"]
  node_adminui["Admin dashboard"]
  node_api_client["HTTP API client<br/>[api.ts]"]
end

subgraph group_api["Backend API"]
  node_server["Go API server<br/>[main.go]"]
  node_handlers["HTTP handlers"]
  node_authmiddleware["Auth middleware<br/>[auth.go]"]
  node_firebaseverify["Firebase verification<br/>[firebase.go]"]
end

subgraph group_booking["Booking and realtime"]
  node_models["Booking domain models"]
  node_repositories["Data repositories"]
  node_hub["WebSocket hub<br/>[hub.go]"]
  node_ws_handler["WebSocket endpoint"]
  node_consumer["Ticket worker<br/>[consumer.go]"]
end

subgraph group_services["External services"]
  node_mongodb[("MongoDB")]
  node_redis[("Redis seat locks")]
  node_rabbit["RabbitMQ queue"]
  node_firebase["Firebase Auth"]
end

node_customer(("Cinema customer"))

node_customer -->|"uses"| node_frontend
node_frontend -->|"renders routes"| node_routing
node_routing -->|"routes to"| node_catalog
node_routing -->|"routes to"| node_authviews
node_routing -->|"routes to"| node_moviedetail
node_routing -->|"routes to"| node_seatui
node_routing -->|"routes to"| node_ticketsui
node_routing -->|"routes to"| node_adminui
node_frontend -->|"uses state"| node_authstore
node_authviews -->|"authenticates via"| node_authstore
node_authstore -->|"uses auth"| node_firebaseclient
node_firebaseclient -->|"authenticates"| node_firebase
node_routing -->|"checks access"| node_authstore
node_moviedetail -->|"fetches catalog"| node_api_client
node_seatui -->|"locks and confirms"| node_api_client
node_ticketsui -->|"fetches tickets"| node_api_client
node_adminui -->|"manages bookings"| node_api_client
node_api_client -->|"attaches ID token"| node_firebaseclient
node_api_client -->|"calls REST API"| node_server
node_server -->|"serves requests"| node_handlers
node_handlers -.->|"protects routes"| node_authmiddleware
node_authmiddleware -.->|"verifies identity"| node_firebaseverify
node_handlers -.->|"accesses data"| node_repositories
node_repositories -->|"reads and writes"| node_mongodb
node_handlers -->|"acquires seat locks"| node_redis
node_handlers -->|"broadcasts seat status"| node_hub
node_seatui -->|"receives live updates"| node_hub
node_server -.->|"serves WebSocket"| node_ws_handler
node_handlers -->|"publishes booking"| node_rabbit
node_rabbit -->|"delivers booking"| node_consumer

click node_frontend "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/App.vue"
click node_routing "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/router/index.ts"
click node_authviews "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/LoginView.vue"
click node_authstore "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/stores/auth.ts"
click node_firebaseclient "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/firebase.ts"
click node_catalog "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/HomeView.vue"
click node_moviedetail "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/MovieDetailView.vue"
click node_seatui "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/SeatSelectionView.vue"
click node_ticketsui "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/TicketView.vue"
click node_adminui "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/AdminDashboardView.vue"
click node_api_client "https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/services/api.ts"
click node_server "https://github.com/palanoyz/cinemahub/blob/main/Backend/cmd/server/main.go"
click node_handlers "https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/handler"
click node_authmiddleware "https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/middleware/auth.go"
click node_firebaseverify "https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/auth/firebase.go"
click node_models "https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/model"
click node_repositories "https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/repository"
click node_hub "https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/websocket/hub.go"
click node_ws_handler "https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/handler/websocket_handler.go"
click node_consumer "https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/websocket/consumer.go"

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_frontend,node_routing,node_authviews,node_authstore,node_firebaseclient,node_catalog,node_moviedetail,node_seatui,node_ticketsui,node_adminui,node_api_client toneBlue
class node_server,node_handlers,node_authmiddleware,node_firebaseverify toneAmber
class node_models,node_repositories,node_hub,node_ws_handler,node_consumer toneMint
class node_mongodb,node_redis,node_rabbit,node_firebase toneRose
class node_customer toneIndigo
```

## Components

### Customer application

- [Vue application](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/App.vue): `Frontend/src/App.vue`
- [Route access](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/router/index.ts): `Frontend/src/router/index.ts`
- [Login and signup](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/LoginView.vue): `Frontend/src/views/LoginView.vue`
- [Auth state](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/stores/auth.ts): `Frontend/src/stores/auth.ts`
- [Firebase client](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/firebase.ts): `Frontend/src/firebase.ts`
- [Movie browsing](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/HomeView.vue): `Frontend/src/views/HomeView.vue`
- [Movie and showtimes](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/MovieDetailView.vue): `Frontend/src/views/MovieDetailView.vue`
- [Seat selection](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/SeatSelectionView.vue): `Frontend/src/views/SeatSelectionView.vue`
- [Customer tickets](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/TicketView.vue): `Frontend/src/views/TicketView.vue`
- [Admin dashboard](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/views/AdminDashboardView.vue): `Frontend/src/views/AdminDashboardView.vue`
- [HTTP API client](https://github.com/palanoyz/cinemahub/blob/main/Frontend/src/services/api.ts): `Frontend/src/services/api.ts`

### Backend API

- [Go API server](https://github.com/palanoyz/cinemahub/blob/main/Backend/cmd/server/main.go): `Backend/cmd/server/main.go`
- [HTTP handlers](https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/handler): `Backend/internal/handler`
- [Auth middleware](https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/middleware/auth.go): `Backend/internal/middleware/auth.go`
- [Firebase verification](https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/auth/firebase.go): `Backend/internal/auth/firebase.go`

### Booking and realtime

- [Booking domain models](https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/model): `Backend/internal/model`
- [Data repositories](https://github.com/palanoyz/cinemahub/tree/main/Backend/internal/repository): `Backend/internal/repository`
- [WebSocket hub](https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/websocket/hub.go): `Backend/internal/websocket/hub.go`
- [WebSocket endpoint](https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/handler/websocket_handler.go): `Backend/internal/handler/websocket_handler.go`
- [Ticket worker](https://github.com/palanoyz/cinemahub/blob/main/Backend/internal/websocket/consumer.go): `Backend/internal/websocket/consumer.go`

### External services

- **MongoDB**
- **Redis seat locks**
- **RabbitMQ queue**
- **Firebase Auth**

### Other components

- **Cinema customer**

## Connections

- Cinema customer → Vue application: uses (evidence: `README.md`)
- Vue application → Route access: renders routes (evidence: `Frontend/src/main.ts`)
- Route access → Movie browsing: routes to (evidence: `Frontend/src/router/index.ts`)
- Route access → Login and signup: routes to (evidence: `Frontend/src/router/index.ts`)
- Route access → Movie and showtimes: routes to (evidence: `Frontend/src/router/index.ts`)
- Route access → Seat selection: routes to (evidence: `Frontend/src/router/index.ts`)
- Route access → Customer tickets: routes to (evidence: `Frontend/src/router/index.ts`)
- Route access → Admin dashboard: routes to (evidence: `Frontend/src/router/index.ts`)
- Vue application → Auth state: uses state (evidence: `Frontend/src/App.vue`)
- Login and signup → Auth state: authenticates via (evidence: `Frontend/src/views/LoginView.vue`)
- Auth state → Firebase client: uses auth (evidence: `Frontend/src/stores/auth.ts`)
- Firebase client → Firebase Auth: authenticates (evidence: `README.md`)
- Route access → Auth state: checks access (evidence: `Frontend/src/router/index.ts`)
- Movie and showtimes → HTTP API client: fetches catalog (evidence: `Frontend/src/views/MovieDetailView.vue`)
- Seat selection → HTTP API client: locks and confirms (evidence: `Frontend/src/views/SeatSelectionView.vue`)
- Customer tickets → HTTP API client: fetches tickets (evidence: `Frontend/src/views/TicketView.vue`)
- Admin dashboard → HTTP API client: manages bookings (evidence: `Frontend/src/views/AdminDashboardView.vue`)
- HTTP API client → Firebase client: attaches ID token (evidence: `Frontend/src/services/api.ts`)
- HTTP API client → Go API server: calls REST API (evidence: `README.md`)
- Go API server → HTTP handlers: serves requests (evidence: `README.md`)
- HTTP handlers → Auth middleware: protects routes
- Auth middleware → Firebase verification: verifies identity
- HTTP handlers → Data repositories: accesses data
- Data repositories → MongoDB: reads and writes (evidence: `README.md`)
- HTTP handlers → Redis seat locks: acquires seat locks (evidence: `README.md`)
- HTTP handlers → WebSocket hub: broadcasts seat status (evidence: `README.md`)
- Seat selection → WebSocket hub: receives live updates (evidence: `README.md`)
- Go API server → WebSocket endpoint: serves WebSocket
- HTTP handlers → RabbitMQ queue: publishes booking (evidence: `README.md`)
- RabbitMQ queue → Ticket worker: delivers booking (evidence: `README.md`)