siimee/docs/frontend/routes.md

Frontend System Breakdown

Break down of the different sections of the frontend application

Application Areas

API Handler

Use the built-in browser fetch() API and syncronous functions to retrieve data. Data is fed to the entity-screener for validation

Entity Service and Screener

Uses Joi() to validate outgoing and incoming entites. Take in parsed database data and output validated objects Entities are fed to the appropriate vuex-store module

Vuex Store

Retrieves data from entity-screener and stores it for global access Prepares data output for presentation and ease-of-access before sending to components Prepares data input for save-ability before sending to entity-screener

Components

Vue components to actually display data

Component Hierarchy

Window
|- Global Navigation
|- - Account Control Modal
|- - - Edit Profile
|- - - - Back
|- - - - Edit Photos
|- - - - - Back
|- - - Edit Survey
|- - - - Back
|- - - Search Settings
|- - - - Max-Distance | Remote
|- - - - Part-time | Full-time
|- - - - Current Location
|- - - - - Back
|- - - - Back
|- - - My Account Settings
|- - - - Back
|- Matches
|- - Group (Chat)
|- - - Reveal
|- - - - Back
|- - - Group Settings
|- - - - Leave
|- - - - - OK
|- - - - - CANCEL
|- - - - Mute
|- - - - Other Profile Link
|- - - - - Back
|- Browse Profiles
|- - Match
|- - Hide
|- - Search Settings (see above)