> For the complete documentation index, see [llms.txt](https://docs.giize.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.giize.com/product-docs/getting-started/architecture-overview.md).

# Architecture Overview

## Current Architecture

The project is still a combined local-runtime application:

* frontend: React + Vite
* backend middleware: `frontend/vite.config.js`
* automation: Node + Playwright scripts in `scripts/`
* data layer: JSON state and cache files in `data/`

## Main Entry Points

### Frontend

* `frontend/src/App.jsx`
* `frontend/src/pages/*`
* `frontend/src/components/*`
* `frontend/src/lib/api.js`
* `frontend/src/lib/sdp.js`

### Runtime And Middleware

* `frontend/vite.config.js`
* request handlers for `/api/*`, `/data/*`, `/config/*`
* spawn points for Playwright-backed scripts

### Automation Scripts

* `scripts/sdp-scrape.mjs`
* `scripts/order-scrape.mjs`
* `scripts/openvpn-sync.mjs`
* `scripts/ts-scrape.mjs`
* `scripts/ts-create.mjs`

## Data Flow

The UI generally talks to local middleware endpoints first, not directly to remote systems.

Typical pattern:

1. React page calls local `/api/*`
2. middleware reads config/session/data files
3. middleware runs script or remote API call
4. script writes JSON outputs under `data/`
5. UI reloads those outputs

## Integration Surfaces

* IT Portal / CMDB APIs
* SDP REST API
* TS / Jira-like flows
* ACL and related internal sources

## Rule Of Thumb

* if you change a page, inspect both the page and the script/data contract behind it
* if you change an integration, inspect both `document/` notes and the current script implementation