# jonscott2/barcode-scanner-cs465 architecture

> Architecture diagram of the GitHub repository jonscott2/barcode-scanner-cs465, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-13). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/jonscott2/barcode-scanner-cs465
- Repository: https://github.com/jonscott2/barcode-scanner-cs465

## Overview

This is a food-inventory web app: users scan product barcodes, resolve product details, and track scanned items and their age/expiry; the project also documents recipe suggestions based on available ingredients. The graph separates the browser workflow, inventory/auth services, and API integrations. Source excerpts show the scanner’s calls and local/Firestore persistence, while README describes the barcode and recipe capabilities. Recipe-page/API wiring and some frontend registration details are not shown, so those relationships are marked unverified rather than asserted.

Main entry points: [`src/js/index.js`](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/index.js) (Barcode scanning), [`src/js/services/storage.js`](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/storage.js) (Browser storage), [`src/App.jsx`](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/App.jsx) (Page router), [`src/js/helpers/fetchItemInfo.js`](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/helpers/fetchItemInfo.js) (Product lookup)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Web experience"]
  node_router["Page router<br/>[App.jsx]"]
  node_home["Home screen<br/>[HomePage.jsx]"]
  node_ingredients["Ingredients page<br/>[Ingredients.jsx]"]
  node_recipes["Recipes page<br/>[Recipes.jsx]"]
end

subgraph group_inventory["Scanning and inventory"]
  node_scanner["Barcode scanning<br/>[index.js]"]
  node_camera["Camera capture<br/>[video-capture.js]"]
  node_reader["Barcode reader<br/>[BarcodeReader.js]"]
  node_lookup["Product lookup<br/>[fetchItemInfo.js]"]
  node_history["Inventory history<br/>[bs-history.js]"]
  node_itemresult["Item result<br/>[bs-result.js]"]
end

subgraph group_identity["Identity and persistence"]
  node_localstore[("Browser storage<br/>[storage.js]")]
  node_firebaseauth["Firebase auth<br/>[firebase-auth.js]"]
  node_firebaseconfig["Firebase setup<br/>[firebase-config.js]"]
  node_scandata["Scan persistence<br/>[firebase-scans.js]"]
end

subgraph group_apis["External and server APIs"]
  node_upcservice["UPC lookup service<br/>[proxy.js]"]
  node_upcfunction["UPC function<br/>[upc.js]"]
  node_upcproxy["UPC function proxy<br/>[upc-proxy.js]"]
  node_recipedb["Recipe API<br/>[RecipeDB.js]"]
  node_mealdb["Meal API"]
end

node_user(("User"))

node_user -->|"opens pages"| node_router
node_router -->|"routes to"| node_home
node_router -->|"routes to"| node_ingredients
node_router -->|"routes to"| node_recipes
node_home -.->|"hosts scanner"| node_scanner
node_scanner -->|"decodes barcode"| node_reader
node_scanner -->|"uses capture"| node_camera
node_scanner -->|"looks up item"| node_lookup
node_lookup -.->|"requests product"| node_upcservice
node_user -.->|"resolves UPC"| node_upcservice
node_scanner -->|"saves scan"| node_scandata
node_scanner -->|"reads settings"| node_localstore
node_history -->|"reads and writes"| node_localstore
node_history -->|"loads scan history"| node_scandata
node_itemresult -->|"reads settings"| node_localstore
node_scandata -->|"backs up scans"| node_localstore
node_scandata -.->|"uses Firebase"| node_firebaseconfig
node_firebaseauth -->|"initializes auth"| node_firebaseconfig
node_scanner -->|"initializes auth"| node_firebaseauth
node_localstore -->|"posts ingredients"| node_recipedb
node_recipedb -.->|"searches meals"| node_mealdb
node_recipes -.->|"requests suggestions"| node_recipedb
node_lookup -.->|"may use proxy"| node_upcfunction
node_lookup -.->|"may use proxy"| node_upcproxy

click node_router "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/App.jsx"
click node_home "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/HomePage.jsx"
click node_ingredients "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/pages/Ingredients.jsx"
click node_recipes "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/pages/Recipes.jsx"
click node_scanner "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/index.js"
click node_camera "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/components/video-capture.js"
click node_reader "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/helpers/BarcodeReader.js"
click node_lookup "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/helpers/fetchItemInfo.js"
click node_history "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/components/bs-history.js"
click node_itemresult "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/components/bs-result.js"
click node_localstore "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/storage.js"
click node_firebaseauth "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/firebase-auth.js"
click node_firebaseconfig "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/firebase-config.js"
click node_scandata "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/firebase-scans.js"
click node_upcservice "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/server/proxy.js"
click node_upcfunction "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/netlify/functions/upc.js"
click node_upcproxy "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/functions/upc-proxy.js"
click node_recipedb "https://github.com/jonscott2/barcode-scanner-cs465/blob/main/server/RecipeDB.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_router,node_home,node_ingredients,node_recipes,node_user toneBlue
class node_scanner,node_camera,node_reader,node_lookup,node_history,node_itemresult toneAmber
class node_localstore,node_firebaseauth,node_firebaseconfig,node_scandata toneMint
class node_upcservice,node_upcfunction,node_upcproxy,node_recipedb,node_mealdb toneRose
```

## Components

### Web experience

- [Page router](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/App.jsx): `src/App.jsx`
- [Home screen](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/HomePage.jsx): `src/HomePage.jsx`
- [Ingredients page](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/pages/Ingredients.jsx): `src/pages/Ingredients.jsx`
- [Recipes page](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/pages/Recipes.jsx): `src/pages/Recipes.jsx`

### Scanning and inventory

- [Barcode scanning](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/index.js): `src/js/index.js`
- [Camera capture](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/components/video-capture.js): `src/js/components/video-capture.js`
- [Barcode reader](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/helpers/BarcodeReader.js): `src/js/helpers/BarcodeReader.js`
- [Product lookup](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/helpers/fetchItemInfo.js): `src/js/helpers/fetchItemInfo.js`
- [Inventory history](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/components/bs-history.js): `src/js/components/bs-history.js`
- [Item result](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/components/bs-result.js): `src/js/components/bs-result.js`

### Identity and persistence

- [Browser storage](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/storage.js): `src/js/services/storage.js`
- [Firebase auth](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/firebase-auth.js): `src/js/services/firebase-auth.js`
- [Firebase setup](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/firebase-config.js): `src/js/services/firebase-config.js`
- [Scan persistence](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/src/js/services/firebase-scans.js): `src/js/services/firebase-scans.js`

### External and server APIs

- [UPC lookup service](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/server/proxy.js): `server/proxy.js`
- [UPC function](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/netlify/functions/upc.js): `netlify/functions/upc.js`
- [UPC function proxy](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/functions/upc-proxy.js): `functions/upc-proxy.js`
- [Recipe API](https://github.com/jonscott2/barcode-scanner-cs465/blob/main/server/RecipeDB.js): `server/RecipeDB.js`
- **Meal API**

### Other components

- **User**

## Connections

- User → Page router: opens pages (evidence: `src/App.jsx`)
- Page router → Home screen: routes to (evidence: `src/App.jsx`)
- Page router → Ingredients page: routes to (evidence: `src/App.jsx`)
- Page router → Recipes page: routes to (evidence: `src/App.jsx`)
- Home screen → Barcode scanning: hosts scanner
- Barcode scanning → Barcode reader: decodes barcode (evidence: `src/js/index.js`)
- Barcode scanning → Camera capture: uses capture (evidence: `src/js/index.js`)
- Barcode scanning → Product lookup: looks up item (evidence: `src/js/index.js`)
- Product lookup → UPC lookup service: requests product
- User → UPC lookup service: resolves UPC
- Barcode scanning → Scan persistence: saves scan (evidence: `src/js/index.js`)
- Barcode scanning → Browser storage: reads settings (evidence: `src/js/index.js`)
- Inventory history → Browser storage: reads and writes (evidence: `src/js/components/bs-history.js`)
- Inventory history → Scan persistence: loads scan history (evidence: `src/js/components/bs-history.js`)
- Item result → Browser storage: reads settings (evidence: `src/js/components/bs-result.js`)
- Scan persistence → Browser storage: backs up scans (evidence: `src/js/services/firebase-scans.js`)
- Scan persistence → Firebase setup: uses Firebase (evidence: `src/js/services/firebase-scans.js`)
- Firebase auth → Firebase setup: initializes auth (evidence: `src/js/services/firebase-auth.js`)
- Barcode scanning → Firebase auth: initializes auth (evidence: `src/js/index.js`)
- Browser storage → Recipe API: posts ingredients (evidence: `src/js/services/storage.js`)
- Recipe API → Meal API: searches meals
- Recipes page → Recipe API: requests suggestions
- Product lookup → UPC function: may use proxy
- Product lookup → UPC function proxy: may use proxy