# skeplys83/3d-tshirt-shop architecture

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

- Interactive diagram: https://gitdiagram.com/skeplys83/3d-tshirt-shop
- Repository: https://github.com/skeplys83/3d-tshirt-shop

## Overview

This is a browser-based 3D T-shirt shop with a Django API. Shoppers explore products in a virtual store, manage a basket, provide customer details, and pay through Stripe; users can also register and manage profiles. Staff have product, order, and user administration. The README documents Stripe webhooks updating order status and confirmation email delivery. Source excerpts are partial, so links between unsampled backend stages are limited to documented behavior; the frontend scene’s detailed product-loading wiring is also not shown.

Main entry points: [`backend/shopcore/payment`](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/payment) (Payment service), [`backend/shopcore/orders`](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/orders) (Order service), [`backend/shopcore/users`](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/users) (User service), [`backend/shopcore/products`](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/products) (Product service)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Shop experience"]
  node_app["Shop shell<br/>[App.svelte]"]
  node_scene["3D shop scene<br/>[Scene.svelte]"]
  node_shopmodel["Shop model<br/>[shopModel.svelte]"]
  node_tryon["Virtual try-on"]
end

subgraph group_commerce["Commerce workflow"]
  node_productpages["Product pages<br/>[+page.svelte]"]
  node_cart["Shopping basket<br/>[+page.svelte]"]
  node_checkout["Checkout<br/>[+page.svelte]"]
  node_success["Payment result<br/>[+page.svelte]"]
  node_failure["Failed payment<br/>[+page.svelte]"]
end

subgraph group_identity["Accounts and admin"]
  node_authpages["Login and register<br/>[auth.js]"]
  node_profile["Profile<br/>[+page.svelte]"]
  node_admin["Admin board<br/>[+page.svelte]"]
end

subgraph group_backend["Backend services"]
  node_usersapi["User service"]
  node_productsapi["Product service"]
  node_ordersapi["Order service"]
  node_paymentapi["Payment service"]
  node_emailapi["Email service"]
  node_apiroot["API routing<br/>[urls.py]"]
  node_database[("PostgreSQL<br/>[settings.py]")]
end

subgraph group_integrations["External services"]
  node_stripe["Stripe"]
  node_smtp["SMTP email"]
end

node_shopper(("Shopper"))
node_staff(("Staff user"))

node_shopper -->|"explores"| node_app
node_app -->|"renders"| node_scene
node_scene -->|"displays"| node_shopmodel
node_shopper -->|"browses"| node_productpages
node_productpages -->|"requests products"| node_productsapi
node_shopper -.->|"tries on"| node_tryon
node_shopper -->|"selects items"| node_cart
node_cart -->|"continues"| node_checkout
node_checkout -->|"loads products"| node_productsapi
node_checkout -->|"logs in"| node_authpages
node_checkout -->|"creates checkout"| node_paymentapi
node_paymentapi -->|"creates session"| node_stripe
node_stripe -->|"sends webhook"| node_paymentapi
node_paymentapi -->|"updates order"| node_ordersapi
node_paymentapi -->|"redirects after payment"| node_success
node_paymentapi -->|"redirects on failure"| node_failure
node_ordersapi -->|"triggers confirmation"| node_emailapi
node_emailapi -->|"sends email"| node_smtp
node_shopper -->|"registers or logs in"| node_authpages
node_authpages -->|"calls auth API"| node_usersapi
node_shopper -->|"manages profile"| node_profile
node_profile -->|"updates account"| node_usersapi
node_staff -->|"manages shop"| node_admin
node_admin -->|"manages products"| node_productsapi
node_admin -->|"manages orders"| node_ordersapi
node_admin -->|"manages users"| node_usersapi
node_productsapi -->|"reads and writes"| node_database
node_usersapi -->|"reads and writes"| node_database
node_ordersapi -->|"reads and writes"| node_database
node_paymentapi -->|"reads and writes"| node_database
node_apiroot -->|"routes requests"| node_productsapi
node_apiroot -->|"routes requests"| node_usersapi
node_apiroot -->|"routes requests"| node_ordersapi
node_apiroot -->|"routes requests"| node_paymentapi

click node_app "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/App.svelte"
click node_scene "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/Scene.svelte"
click node_shopmodel "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/3D/shopModel.svelte"
click node_tryon "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/3D/tryonOverlay.svelte"
click node_productpages "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/%2Bpage.svelte"
click node_cart "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/shoppingBasket/%2Bpage.svelte"
click node_checkout "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/checkout/%2Bpage.svelte"
click node_success "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/paymentSuccess/%2Bpage.svelte"
click node_failure "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/paymentFailed/%2Bpage.svelte"
click node_authpages "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/api/auth/auth.js"
click node_profile "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/profile/%2Bpage.svelte"
click node_admin "https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/adminBoard/%2Bpage.svelte"
click node_usersapi "https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/users"
click node_productsapi "https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/products"
click node_ordersapi "https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/orders"
click node_paymentapi "https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/payment"
click node_emailapi "https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/email_service"
click node_apiroot "https://github.com/skeplys83/3d-tshirt-shop/blob/main/backend/shopcore/shopcore/urls.py"
click node_database "https://github.com/skeplys83/3d-tshirt-shop/blob/main/backend/shopcore/shopcore/settings.py"

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_scene,node_shopmodel,node_tryon,node_staff toneBlue
class node_productpages,node_cart,node_checkout,node_success,node_failure toneAmber
class node_authpages,node_profile,node_admin toneMint
class node_usersapi,node_productsapi,node_ordersapi,node_paymentapi,node_emailapi,node_apiroot,node_database toneRose
class node_stripe,node_smtp,node_shopper toneIndigo
```

## Components

### Shop experience

- [Shop shell](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/App.svelte): `frontend/shop-app/src/lib/components/App.svelte`
- [3D shop scene](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/Scene.svelte): `frontend/shop-app/src/lib/components/Scene.svelte`
- [Shop model](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/3D/shopModel.svelte): `frontend/shop-app/src/lib/components/3D/shopModel.svelte`
- [Virtual try-on](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/lib/components/3D/tryonOverlay.svelte): `frontend/shop-app/src/lib/components/3D/tryonOverlay.svelte`

### Commerce workflow

- [Product pages](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/%2Bpage.svelte): `frontend/shop-app/src/routes/+page.svelte`
- [Shopping basket](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/shoppingBasket/%2Bpage.svelte): `frontend/shop-app/src/routes/shoppingBasket/+page.svelte`
- [Checkout](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/checkout/%2Bpage.svelte): `frontend/shop-app/src/routes/checkout/+page.svelte`
- [Payment result](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/paymentSuccess/%2Bpage.svelte): `frontend/shop-app/src/routes/paymentSuccess/+page.svelte`
- [Failed payment](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/paymentFailed/%2Bpage.svelte): `frontend/shop-app/src/routes/paymentFailed/+page.svelte`

### Accounts and admin

- [Login and register](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/api/auth/auth.js): `frontend/shop-app/src/api/auth/auth.js`
- [Profile](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/profile/%2Bpage.svelte): `frontend/shop-app/src/routes/profile/+page.svelte`
- [Admin board](https://github.com/skeplys83/3d-tshirt-shop/blob/main/frontend/shop-app/src/routes/adminBoard/%2Bpage.svelte): `frontend/shop-app/src/routes/adminBoard/+page.svelte`

### Backend services

- [User service](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/users): `backend/shopcore/users`
- [Product service](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/products): `backend/shopcore/products`
- [Order service](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/orders): `backend/shopcore/orders`
- [Payment service](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/payment): `backend/shopcore/payment`
- [Email service](https://github.com/skeplys83/3d-tshirt-shop/tree/main/backend/shopcore/email_service): `backend/shopcore/email_service`
- [API routing](https://github.com/skeplys83/3d-tshirt-shop/blob/main/backend/shopcore/shopcore/urls.py): `backend/shopcore/shopcore/urls.py`
- [PostgreSQL](https://github.com/skeplys83/3d-tshirt-shop/blob/main/backend/shopcore/shopcore/settings.py): `backend/shopcore/shopcore/settings.py`

### External services

- **Stripe**
- **SMTP email**

### Other components

- **Shopper**
- **Staff user**

## Connections

- Shopper → Shop shell: explores
- Shop shell → 3D shop scene: renders
- 3D shop scene → Shop model: displays
- Shopper → Product pages: browses
- Product pages → Product service: requests products
- Shopper → Virtual try-on: tries on
- Shopper → Shopping basket: selects items
- Shopping basket → Checkout: continues
- Checkout → Product service: loads products
- Checkout → Login and register: logs in
- Checkout → Payment service: creates checkout
- Payment service → Stripe: creates session
- Stripe → Payment service: sends webhook
- Payment service → Order service: updates order
- Payment service → Payment result: redirects after payment
- Payment service → Failed payment: redirects on failure
- Order service → Email service: triggers confirmation
- Email service → SMTP email: sends email
- Shopper → Login and register: registers or logs in
- Login and register → User service: calls auth API
- Shopper → Profile: manages profile
- Profile → User service: updates account
- Staff user → Admin board: manages shop
- Admin board → Product service: manages products
- Admin board → Order service: manages orders
- Admin board → User service: manages users
- Product service → PostgreSQL: reads and writes
- User service → PostgreSQL: reads and writes
- Order service → PostgreSQL: reads and writes
- Payment service → PostgreSQL: reads and writes
- API routing → Product service: routes requests
- API routing → User service: routes requests
- API routing → Order service: routes requests
- API routing → Payment service: routes requests