DocHub
DocHub/WIT PropTech/System Overview/Architecture & Deployment
System architecture, both environments, and deployment pipeline

Architecture & Deployment

Purpose

WIT PropTech is a web application that reproduces Craig Crawshaw’s Excel-based PropTech/IT infrastructure cost estimator. It calculates equipment costs, installation, OPEX, BAU recurring costs, and generates a 3-page landscape Design Brief PDF.

The goal is an exact reproduction of the spreadsheet’s formulas and functionality — nothing more.

Architecture

The application follows a standard three-tier pattern: React frontend, Express/TypeScript backend, PostgreSQL database.

Request Flow

Browser → nginx (SSL termination) → Static files (frontend/dist/)
                                   → /api/* → Node.js backend (port 3100)
                                              → PostgreSQL (port 5433)
                                              → Puppeteer/Chromium (PDF generation)

Technology Stack

Layer Technology
Frontend React 18, TypeScript, Vite, TailwindCSS, React Query, Axios
Backend Node.js 20 (ESM), Express, TypeScript
Database PostgreSQL 15
PDF Generation Puppeteer with Chromium
Excel Parsing xlsx library
Production Bare Node.js + system nginx + shared PostgreSQL
Local Dev Docker Compose (4 containers)

Environments

Local Development

Service Port Container
Web App 8004 wit-nginx
Backend API 4002 wit-backend
Frontend Dev 5173 wit-frontend
PostgreSQL 5434 wit-postgres

Start: cd /home/chas-watkins/code/Craig && docker compose up -d

Production (DigitalOcean Droplet)

Item Value
URL https://wit.ipnoelp.com
Backend Port 3100
Database wit_db / wit_user in hypnoelp-cms-db container (port 5433)
nginx Config /etc/nginx/sites-available/wit
SSL Let’s Encrypt (expires 2026-05-22)
Chromium /snap/bin/chromium
Start/Stop /home/chas-watkins/code/WIT/start-wit.sh / stop-wit.sh
Logs /tmp/wit-backend.log

Production uses bare Node.js process (not Docker) to save RAM on the shared droplet. The frontend is a pre-built static bundle served directly by nginx.

Deployment Pipeline

  1. Edit source locally at /home/chas-watkins/code/Craig/
  2. rsync to droplet: /home/chas-watkins/code/WIT/
  3. Build on droplet: cd backend && npx tsc
  4. Restart: stop-wit.sh && start-wit.sh
  5. Verify: curl https://wit.ipnoelp.com/api/health

Dependencies

  • Shares the PostgreSQL container (hypnoelp-cms-db) with CMS
  • Shares the DigitalOcean droplet (178.128.183.166) with CMS, DocHub, WhatsApp, ElevenLabs
  • DNS via Cloudflare (wit.ipnoelp.com A record, gray cloud)
  • SSL via Let’s Encrypt / certbot