# glorianb/hypertube architecture

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

- Interactive diagram: https://gitdiagram.com/glorianb/hypertube
- Repository: https://github.com/glorianb/hypertube
- Video tour (about a minute): https://gitdiagram.com/glorianb/hypertube/video

## Overview

HyperTube is a movie-discovery and streaming website. The main user journey runs from browsing movie listings through selecting a title to downloading/streaming it in the player; accounts, profiles, comments, and subtitle support are adjacent product flows. The tree documents client features and server modules, but several client components and API controllers were not sampled, so uncertain client-to-endpoint wiring is left out. The server movie controller’s torrent, video, and subtitle behavior is directly supported by the sampled source.

Main entry points: [`client/src/App.js`](https://github.com/glorianb/hypertube/blob/master/client/src/App.js) (App and routes), [`server/src/api/controllers/movieController.js`](https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/movieController.js) (Movie controller), [`server/src/api/index.js`](https://github.com/glorianb/hypertube/blob/master/server/src/api/index.js) (API router), [`client/src/service/movie.js`](https://github.com/glorianb/hypertube/blob/master/client/src/service/movie.js) (Movie service)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web client"]
  node_app["App and routes<br/>[App.js]"]
  node_home["Home page<br/>[HomePage.js]"]
end

subgraph group_catalog["Movie catalog"]
  node_movie_list["Movie listings<br/>[ListMovie.js]"]
  node_movie_service["Movie service<br/>[movie.js]"]
  node_tmdb["TMDB service<br/>[tmdb.js]"]
  node_yts["YTS service<br/>[yts.js]"]
end

subgraph group_playback["Playback"]
  node_player_page["Player page<br/>[PlayerPage.js]"]
  node_video_player["Video player<br/>[VideoPlayer.js]"]
  node_movie_controller["Movie controller<br/>[movieController.js]"]
  node_torrent_config["Torrent settings<br/>[torrentConfig.js]"]
  node_stream_handler["Subtitle handler<br/>[streamHandler.js]"]
  node_movie_files[("Downloaded movies")]
end

subgraph group_accounts["Accounts"]
  node_sign_in["Sign in and sign up<br/>[SignInUp.js]"]
  node_profile["Profile pages<br/>[Profil.js]"]
  node_edit_profile["Edit profile<br/>[EditProfil.js]"]
  node_user_list["User directory<br/>[ListUsers.js]"]
end

subgraph group_server["API and persistence"]
  node_api["API router<br/>[index.js]"]
  node_auth_routes["Auth routes<br/>[auth.js]"]
  node_auth_controller["Auth controller<br/>[authController.js]"]
  node_user_controller["User controller<br/>[userController.js]"]
  node_user_model["User model<br/>[User.js]"]
  node_movie_model["Movie model<br/>[Movie.js]"]
  node_passport["Passport config<br/>[passport-config.js]"]
  node_mailer["Email service<br/>[sendMail.js]"]
  node_server_app["Express application<br/>[app.js]"]
end

node_viewer(("Viewer"))
node_tmdb_api["TMDB"]
node_yts_api["YTS"]
node_mongo[("MongoDB")]

node_viewer -->|"uses"| node_app
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_movie_list
node_app -->|"routes to"| node_player_page
node_app -->|"routes to"| node_sign_in
node_app -->|"routes to"| node_profile
node_app -->|"routes to"| node_edit_profile
node_app -->|"routes to"| node_user_list
node_movie_list -->|"requests movies"| node_movie_service
node_home -->|"requests movies"| node_movie_service
node_movie_service -->|"delegates to"| node_tmdb
node_movie_service -->|"delegates to"| node_yts
node_tmdb -->|"fetches metadata"| node_tmdb_api
node_yts -->|"fetches torrents"| node_yts_api
node_player_page -->|"renders"| node_video_player
node_server_app -->|"mounts API"| node_api
node_api -->|"dispatches"| node_auth_routes
node_api -->|"dispatches"| node_movie_controller
node_api -->|"dispatches"| node_user_controller
node_auth_routes -->|"dispatches"| node_auth_controller
node_auth_routes -->|"authenticates with"| node_passport
node_movie_controller -->|"loads settings"| node_torrent_config
node_movie_controller -->|"reads and writes"| node_movie_model
node_movie_controller -->|"downloads and streams"| node_movie_files
node_movie_controller -->|"converts subtitles"| node_stream_handler
node_user_controller -->|"reads and writes"| node_user_model
node_user_controller -->|"sends account mail"| node_mailer
node_movie_model -->|"persists data"| node_mongo
node_user_model -->|"persists data"| node_mongo

click node_app "https://github.com/glorianb/hypertube/blob/master/client/src/App.js"
click node_home "https://github.com/glorianb/hypertube/blob/master/client/src/components/HomePage/HomePage.js"
click node_movie_list "https://github.com/glorianb/hypertube/blob/master/client/src/components/ListMovie/ListMovie.js"
click node_movie_service "https://github.com/glorianb/hypertube/blob/master/client/src/service/movie.js"
click node_tmdb "https://github.com/glorianb/hypertube/blob/master/client/src/service/tmdb.js"
click node_yts "https://github.com/glorianb/hypertube/blob/master/client/src/service/yts.js"
click node_player_page "https://github.com/glorianb/hypertube/blob/master/client/src/components/PlayerPage/PlayerPage.js"
click node_video_player "https://github.com/glorianb/hypertube/blob/master/client/src/components/VideoPlayer/VideoPlayer.js"
click node_movie_controller "https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/movieController.js"
click node_torrent_config "https://github.com/glorianb/hypertube/blob/master/server/src/api/config/torrentConfig.js"
click node_stream_handler "https://github.com/glorianb/hypertube/blob/master/server/src/api/utils/streamHandler.js"
click node_sign_in "https://github.com/glorianb/hypertube/blob/master/client/src/components/SignInUp/SignInUp.js"
click node_profile "https://github.com/glorianb/hypertube/blob/master/client/src/components/Profil/Profil.js"
click node_edit_profile "https://github.com/glorianb/hypertube/blob/master/client/src/components/Profil/EditProfil.js"
click node_user_list "https://github.com/glorianb/hypertube/blob/master/client/src/components/ListUsers/ListUsers.js"
click node_api "https://github.com/glorianb/hypertube/blob/master/server/src/api/index.js"
click node_auth_routes "https://github.com/glorianb/hypertube/blob/master/server/src/api/routes/auth.js"
click node_auth_controller "https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/authController.js"
click node_user_controller "https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/userController.js"
click node_user_model "https://github.com/glorianb/hypertube/blob/master/server/src/api/models/User.js"
click node_movie_model "https://github.com/glorianb/hypertube/blob/master/server/src/api/models/Movie.js"
click node_passport "https://github.com/glorianb/hypertube/blob/master/server/src/api/config/passport-config.js"
click node_mailer "https://github.com/glorianb/hypertube/blob/master/server/src/api/utils/sendMail.js"
click node_server_app "https://github.com/glorianb/hypertube/blob/master/server/src/app.js"

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_app,node_home,node_viewer toneBlue
class node_movie_list,node_movie_service,node_tmdb,node_yts,node_mongo toneAmber
class node_player_page,node_video_player,node_movie_controller,node_torrent_config,node_stream_handler,node_movie_files toneMint
class node_sign_in,node_profile,node_edit_profile,node_user_list toneRose
class node_api,node_auth_routes,node_auth_controller,node_user_controller,node_user_model,node_movie_model,node_passport,node_mailer,node_server_app,node_tmdb_api,node_yts_api toneIndigo
```

## Components

### Web client

- [App and routes](https://github.com/glorianb/hypertube/blob/master/client/src/App.js): `client/src/App.js`
- [Home page](https://github.com/glorianb/hypertube/blob/master/client/src/components/HomePage/HomePage.js): `client/src/components/HomePage/HomePage.js`

### Movie catalog

- [Movie listings](https://github.com/glorianb/hypertube/blob/master/client/src/components/ListMovie/ListMovie.js): `client/src/components/ListMovie/ListMovie.js`
- [Movie service](https://github.com/glorianb/hypertube/blob/master/client/src/service/movie.js): `client/src/service/movie.js`
- [TMDB service](https://github.com/glorianb/hypertube/blob/master/client/src/service/tmdb.js): `client/src/service/tmdb.js`
- [YTS service](https://github.com/glorianb/hypertube/blob/master/client/src/service/yts.js): `client/src/service/yts.js`

### Playback

- [Player page](https://github.com/glorianb/hypertube/blob/master/client/src/components/PlayerPage/PlayerPage.js): `client/src/components/PlayerPage/PlayerPage.js`
- [Video player](https://github.com/glorianb/hypertube/blob/master/client/src/components/VideoPlayer/VideoPlayer.js): `client/src/components/VideoPlayer/VideoPlayer.js`
- [Movie controller](https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/movieController.js): `server/src/api/controllers/movieController.js`
- [Torrent settings](https://github.com/glorianb/hypertube/blob/master/server/src/api/config/torrentConfig.js): `server/src/api/config/torrentConfig.js`
- [Subtitle handler](https://github.com/glorianb/hypertube/blob/master/server/src/api/utils/streamHandler.js): `server/src/api/utils/streamHandler.js`
- **Downloaded movies**

### Accounts

- [Sign in and sign up](https://github.com/glorianb/hypertube/blob/master/client/src/components/SignInUp/SignInUp.js): `client/src/components/SignInUp/SignInUp.js`
- [Profile pages](https://github.com/glorianb/hypertube/blob/master/client/src/components/Profil/Profil.js): `client/src/components/Profil/Profil.js`
- [Edit profile](https://github.com/glorianb/hypertube/blob/master/client/src/components/Profil/EditProfil.js): `client/src/components/Profil/EditProfil.js`
- [User directory](https://github.com/glorianb/hypertube/blob/master/client/src/components/ListUsers/ListUsers.js): `client/src/components/ListUsers/ListUsers.js`

### API and persistence

- [API router](https://github.com/glorianb/hypertube/blob/master/server/src/api/index.js): `server/src/api/index.js`
- [Auth routes](https://github.com/glorianb/hypertube/blob/master/server/src/api/routes/auth.js): `server/src/api/routes/auth.js`
- [Auth controller](https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/authController.js): `server/src/api/controllers/authController.js`
- [User controller](https://github.com/glorianb/hypertube/blob/master/server/src/api/controllers/userController.js): `server/src/api/controllers/userController.js`
- [User model](https://github.com/glorianb/hypertube/blob/master/server/src/api/models/User.js): `server/src/api/models/User.js`
- [Movie model](https://github.com/glorianb/hypertube/blob/master/server/src/api/models/Movie.js): `server/src/api/models/Movie.js`
- [Passport config](https://github.com/glorianb/hypertube/blob/master/server/src/api/config/passport-config.js): `server/src/api/config/passport-config.js`
- [Email service](https://github.com/glorianb/hypertube/blob/master/server/src/api/utils/sendMail.js): `server/src/api/utils/sendMail.js`
- [Express application](https://github.com/glorianb/hypertube/blob/master/server/src/app.js): `server/src/app.js`

### Other components

- **Viewer**
- **TMDB**
- **YTS**
- **MongoDB**

## Connections

- Viewer → App and routes: uses
- App and routes → Home page: routes to
- App and routes → Movie listings: routes to
- App and routes → Player page: routes to
- App and routes → Sign in and sign up: routes to
- App and routes → Profile pages: routes to
- App and routes → Edit profile: routes to
- App and routes → User directory: routes to
- Movie listings → Movie service: requests movies
- Home page → Movie service: requests movies
- Movie service → TMDB service: delegates to
- Movie service → YTS service: delegates to
- TMDB service → TMDB: fetches metadata
- YTS service → YTS: fetches torrents
- Player page → Video player: renders
- Express application → API router: mounts API
- API router → Auth routes: dispatches
- API router → Movie controller: dispatches
- API router → User controller: dispatches
- Auth routes → Auth controller: dispatches
- Auth routes → Passport config: authenticates with
- Movie controller → Torrent settings: loads settings
- Movie controller → Movie model: reads and writes
- Movie controller → Downloaded movies: downloads and streams
- Movie controller → Subtitle handler: converts subtitles
- User controller → User model: reads and writes
- User controller → Email service: sends account mail
- Movie model → MongoDB: persists data
- User model → MongoDB: persists data