Technical Documentation

Technical Documentation

Architecture

Technology Stack

• Frontend: Vanilla HTML/CSS/JavaScript
• Storage: localStorage
• Encryption: Web Crypto API (AES-256-GCM)
• PWA: Service Worker + Manifest
• Icons: Auto-generated canvas elements

File Structure

cc-planner/ ├── index.html # Main application (all-in-one) ├── manifest.json # PWA configuration └── sw.js # Service Worker for offline

Data Structure

Inventory Item

{
  id: "unique-string",
  name: "Item name",
  category: "masks|filters|purifiers|testing|sanitizers",
  location: "home|work|travel|car|other",
  spec: "Technical specification",
  quantity: number,
  usageRate: number, // per day
  price: number,
  vendor: "Supplier name",
  evidence: "high|moderate|low",
  lastReplaced: Date
}

Vaccine Record
{
  id: "unique-string",
  date: Date,
  type: "Vaccine type",
  notes: "Optional notes"
}