Architecture Layers

Presentation Layer
What users see and interact with
index.html dashboard.html style.css responsive.css
Logic Layer
JavaScript that controls behavior
profile-loader.js module-loader.js sanitize.js
Data Layer
JSON configuration files
profile.json modules-bundle.json
Module Layer
Self-contained feature plugins
modules/ media/

Data Flow

JSON Config
JS Loader
DOM Elements
User Sees

Component Relationships

index.html
Landing page
profile-loader.js
Reads profile.json
profile.json
Personal data
dashboard.html
Project dashboard
module-loader.js
Reads modules bundle
modules-bundle.json
All module data