// ARCHITECTURAL OVERVIEW
A responsive, lightweight event registration portal built with HTML, CSS, and vanilla JS, integrated directly with Google Sheets for data storage. Custom-built for mobile and desktop screens.
// ENGINEERING SPECIFICATIONS & SYSTEM DESIGN
01 / System Architecture & Data Topology
Lightweight, high-traffic event registration portal built with vanilla JavaScript, modern CSS, and Google Sheets backend storage via secure JSONP cross-origin endpoints.
02 / Technical Challenges & Performance Solutions
Zero-latency on-site check-in verification without costly database infrastructure. Built a dynamic QR code generator that encodes registration IDs for instant scanner validation.
03 / Security Model & Data Resilience
Admin gate with credential verification, offline check-in capability, and clamped Malayalam numeric selectors to prevent registration tampering.
// CORE CAPABILITIES & SYSTEM FEATURES
01.
Writes directly to Google Sheets using a secure JSONP (GET-based) script architecture to bypass CORS limitations.
02.
Fully Responsive Design: Clean dark glassmorphic UI styled for both desktops and mobile viewports.
03.
Secure Admin Dashboard: Login gate verifying credentials stored server-side in Google Sheets, persisting state locally.
04.
Dynamic QR Code Generator: Immediately compiles validation URLs encoding the participant's unique Registration ID.
05.
Offline Verification: Admin scans participant QR codes on-site, fetching data from Google Sheets to confirm details.
06.
Clamped Number Inputs: Malayalam numeric selectors with dynamic range clamps and auto-updating total fields.
// TECHNOLOGY COMPONENT STACK
HTML5CSS3JavaScriptGoogle Sheets APIJSONPqrcode.js
// PRODUCTION STANDARDS & QUALITY ASSURANCE
This project was engineered adhering to production-ready principles: modular component separation, comprehensive linting and typing guards, sub-100ms interaction latency, and rigorous offline fallback testing. Designed and deployed with clean documentation and reproducible environments.