# madakadharani177/cinematic-hub architecture

> Architecture diagram of the GitHub repository madakadharani177/cinematic-hub, 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/madakadharani177/cinematic-hub
- Repository: https://github.com/madakadharani177/cinematic-hub

## Overview

Cinematic Hub is a movie-catalog website backed by Spring Boot and MySQL. Visitors browse and filter the catalog, open movie details and trailer links, and save a browser-local watchlist; managers can create, edit, and delete catalog records. The main request path runs from React pages through the Axios API client to REST endpoints, service logic, and JPA persistence. The README documents additional UI capabilities whose detailed implementations were only partly sampled, so those branches are represented at the shared App.jsx path.

Main entry points: [`frontend/src/App.jsx`](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx) (React application), [`backend/src/main/java/com/cinematichub/MovieRepository.java`](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieRepository.java) (Movie repository), [`frontend/src/api.js`](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/api.js) (Axios client), [`backend/src/main/java/com/cinematichub/MovieService.java`](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieService.java) (Movie service)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Movie website"]
  node_app["React application<br/>[App.jsx]"]
  node_browse["Discover and search<br/>[App.jsx]"]
  node_details["Movie details<br/>[App.jsx]"]
  node_watchlist["Browser watchlist<br/>[App.jsx]"]
  node_manage["Movie management<br/>[App.jsx]"]
  node_api_client["Axios client<br/>[api.js]"]
end

subgraph group_api["Catalog API"]
  node_controller["REST endpoints"]
  node_service["Movie service<br/>[MovieService.java]"]
  node_not_found["Not-found error"]
end

subgraph group_data["Movie data"]
  node_repository["Movie repository"]
  node_movie["Movie record<br/>[Movie.java]"]
  node_seeder["Sample data seeder<br/>[DataSeeder.java]"]
end

node_visitor(("Movie visitor"))
node_trailer["Trailer link service"]
node_mysql[("MySQL database")]

node_visitor -->|"uses"| node_app
node_app -->|"routes to"| node_browse
node_app -->|"routes to"| node_details
node_app -->|"routes to"| node_watchlist
node_app -->|"routes to"| node_manage
node_browse -->|"fetches movies"| node_api_client
node_details -->|"fetches movie"| node_api_client
node_manage -->|"manages records"| node_api_client
node_watchlist -->|"saves locally"| node_visitor
node_api_client -->|"sends HTTP requests"| node_controller
node_controller -->|"delegates"| node_service
node_service -->|"queries and saves"| node_repository
node_repository -->|"queries entity"| node_movie
node_repository -.->|"persists records"| node_mysql
node_service -->|"throws"| node_not_found
node_seeder -->|"seeds if empty"| node_repository
node_details -.->|"opens trailer link"| node_trailer

click node_app "https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx"
click node_browse "https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx"
click node_details "https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx"
click node_watchlist "https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx"
click node_manage "https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx"
click node_api_client "https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/api.js"
click node_controller "https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieController.java"
click node_service "https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieService.java"
click node_not_found "https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieNotFoundException.java"
click node_repository "https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieRepository.java"
click node_movie "https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/Movie.java"
click node_seeder "https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/DataSeeder.java"

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_browse,node_details,node_watchlist,node_manage,node_api_client toneBlue
class node_controller,node_service,node_not_found,node_mysql toneAmber
class node_repository,node_movie,node_seeder toneMint
class node_visitor,node_trailer toneIndigo
```

## Components

### Movie website

- [React application](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Discover and search](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Movie details](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Browser watchlist](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Movie management](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Axios client](https://github.com/madakadharani177/cinematic-hub/blob/main/frontend/src/api.js): `frontend/src/api.js`

### Catalog API

- [REST endpoints](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieController.java): `backend/src/main/java/com/cinematichub/MovieController.java`
- [Movie service](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieService.java): `backend/src/main/java/com/cinematichub/MovieService.java`
- [Not-found error](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieNotFoundException.java): `backend/src/main/java/com/cinematichub/MovieNotFoundException.java`

### Movie data

- [Movie repository](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/MovieRepository.java): `backend/src/main/java/com/cinematichub/MovieRepository.java`
- [Movie record](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/Movie.java): `backend/src/main/java/com/cinematichub/Movie.java`
- [Sample data seeder](https://github.com/madakadharani177/cinematic-hub/blob/main/backend/src/main/java/com/cinematichub/DataSeeder.java): `backend/src/main/java/com/cinematichub/DataSeeder.java`

### Other components

- **Movie visitor**
- **Trailer link service**
- **MySQL database**

## Connections

- Movie visitor → React application: uses
- React application → Discover and search: routes to (evidence: `frontend/src/App.jsx`)
- React application → Movie details: routes to (evidence: `frontend/src/App.jsx`)
- React application → Browser watchlist: routes to (evidence: `frontend/src/App.jsx`)
- React application → Movie management: routes to (evidence: `frontend/src/App.jsx`)
- Discover and search → Axios client: fetches movies (evidence: `frontend/src/App.jsx`)
- Movie details → Axios client: fetches movie (evidence: `frontend/src/App.jsx`)
- Movie management → Axios client: manages records (evidence: `frontend/src/App.jsx`)
- Browser watchlist → Movie visitor: saves locally (evidence: `README.md`)
- Axios client → REST endpoints: sends HTTP requests (evidence: `frontend/src/api.js`)
- REST endpoints → Movie service: delegates (evidence: `backend/src/main/java/com/cinematichub/MovieController.java`)
- Movie service → Movie repository: queries and saves (evidence: `backend/src/main/java/com/cinematichub/MovieService.java`)
- Movie repository → Movie record: queries entity (evidence: `backend/src/main/java/com/cinematichub/MovieRepository.java`)
- Movie repository → MySQL database: persists records (evidence: `README.md`)
- Movie service → Not-found error: throws (evidence: `backend/src/main/java/com/cinematichub/MovieService.java`)
- Sample data seeder → Movie repository: seeds if empty (evidence: `backend/src/main/java/com/cinematichub/DataSeeder.java`)
- Movie details → Trailer link service: opens trailer link (evidence: `README.md`)