Arkitektur - M0hammed-1brahim/frugalCompany GitHub Wiki

Arkitektur och Systemdesign

Projektet är ett e-handelsbutik med fokus på försäljning i elektronik delar. Systemet är modulärt och byggt med en tydlig separation mellan backend (PHP), frontend (JS/CSS), samt automatiserade tester (PHPUnit, Jest).

Strukturöversikt (fil/folder)

Katalog / Fil	Innehåll
`src/`	PHP-källkod och funktioner (t.ex. `cart_logic.php`, `cart_action.php`)
`tests/`	Tester i PHPUnit
`style.css`	UI-styling, färgtema, layout
`main.js` & `main.test.js`	UI-funktioner och deras tester
`gpu.php`, `cpu.php`, `index.php`	Frontend-sidor kopplade till produkter
`db.php`, `frugal_company.sql`	Databasanslutning och databasstruktur
`render.yaml`, `dockerfile`	Deployment och konfigurationsfiler
`.gitlab-ci.yml`	CI/CD pipeline via GitLab
`composer.json`, `package.json`	PHP(Composer)- och JS(NPM)-pakethanterare/bibliotek

Viktiga komponenter

Frontend (HTML/CSS/JS)
- Dynamiska produktkort (genereras från databas i gpu.php)
- Interaktiv kundvagn (main.js, add-cart, qty-adjust)
Backend (PHP & MySQL)
- cart_logic.php: Hanterar tillägg, borttagning och uppdatering av varor i kundvagnen
- db.php: Databasanslutning
- gpu.php, cpu.php: Hämtar produkter från databas
Databas
- frugal_company.sql innehåller products_gpu och products_cpu
- PHP hämtar data via mysqli-queries
Testing & Development
- phpunit.xml: Konfiguration av backendtester
- main.test.js: Frontend-interaktioner testas via Jest
- render.yaml: Konfiguration för Render-deployment
- gitlab-ci.yml: Kör tester automatiskt vid push

Flöde – Användarscenario / Use Cases

Användaren går in på gpu.php
Produkter hämtas från databasen via PHP (SELECT * FROM products_gpu)
Användaren klickar "Lägg till i kundvagn" → JS uppdaterar DOM
Cart-data lagras i $_SESSION, uppdateras i cart_action.php
Tester körs via npm test + vendor/bin/phpunit lokalt / via CI

Systemegenskaper

Modulärt och testbart
Responsivt UI
Separata ansvar för databas och logik
Docker container / deployment via Render implementerad.