Overview
We built iCAS-CMU HUB (Integrated Club Administration System) as a team, and I worked on it as a full-stack developer. The app is a web platform for managing university clubs at CMU: it centralizes memberships, events, assignments, budgets, reports, and admin workflows so leaders and staff are not juggling spreadsheets and informal channels. My goal was to help deliver a single place where members can join clubs and take part in activities, while admins and club leaders can run day-to-day operations with clear roles and permissions. The platform is live in production at icas-cmu.turnpro.dev.
The product is organized around role-based experiences: members see dashboards, QR check-in, club discovery, and feedback; leaders get check-in and leadership tools; admins manage club creation, owners, report inboxes, user oversight, and Smart Document flows. Users sign in through a login hub, then land on routes guarded by role, with a sidebar layout (and a separate club workspace with home, assignments, calendar, chat, and members) so the UI stays focused for each persona. We emphasized clear navigation, loading states, and toast feedback so common tasks feel straightforward on desktop and mobile-friendly layouts where it matters.
Technically, the frontend is React 19 + TypeScript with Vite, React Router, Axios, Tailwind-style utility classes, Radix UI primitives, charts (Recharts), rich text (TipTap), and Socket.IO for live chat and updates. The backend is Node.js + Express + TypeScript, structured by feature modules (auth, clubs, assignments, events, check-in, reports, smart documents, LINE webhooks), with JWT in HttpOnly Secure cookies, PostgreSQL via pg driver hosted on Supabase (Tokyo region, transaction pooler), file uploads (Multer), rate limiting, and email/OTP services. The whole stack runs on Docker Compose behind an nginx reverse proxy on a Linux VPS, with TLS terminated by Let's Encrypt, traffic proxied through Cloudflare (DNS, WAF, Bot Fight Mode), with monitoring via UptimeRobot and nightly pg_dump backups via cron.
One challenge was migrating the schema from the team's original MySQL prototype to PostgreSQL on Supabase without losing the Thai-language data integrity or breaking the feature modules. I used pgloader to port the canonical schema (icas_cmu_hub), reworked SSL connection handling for school networks where TLS is intercepted (sslmode=no-verify in pg-node, mapped to require for libpq tools), and gated the previous local-Postgres compose service behind a profile so production and offline-dev environments could co-exist from the same docker-compose.yml. On the app side, wiring Socket.IO with HttpOnly-cookie auth for club-scoped chat (so WebSocket upgrades flow through nginx and inherit the same session), splitting admin vs club navigation to reduce cross-role access, and treating UTF-8 carefully across nginx to Express to Postgres kept Thai names and messages correct end-to-end.
After launch I hardened the production deployment: closed the host Postgres port from the internet, rotated all DB passwords, added strict HTTP security headers (HSTS, X-Frame-Options, Referrer-Policy, Permissions-Policy; graded A on securityheaders.com), blocked common bot reconnaissance paths at the nginx layer, enabled Cloudflare Bot Fight Mode + Browser Integrity Check, and set up automated daily backups + uptime monitoring with alerting. The result is a production-ready, secured deployment that the team can iterate on without scrambling on operations.
