Web Frontend

File & Logic Structure

Our frontend project was created on custom file structure, defined as follows:

• src folder to contain all production files,
• api folder to contain auto-generated files from OpenAPI Generator,
• app folder for main component,
• assets folder for static files to use in app, like images,
• environments folder to store environments config files,
• pages folder to store components for app's pages, with their own subcomponents,
• shared folder to store globally used code,

Code & values locations

• When you are creating component for give page only, create it in this page's components folder.
• When you are creating component for more than one page, eg. Home and Add Task, then create it in shared/components directory,
• When you are creating new page, create page component in pages folder and subfolder components for it,

shared folder contains following folders:

• components for cross-page components,
• consts for constant values files,
• models for developer-defined data interfaces,
• services for developer-defined code service,
• styles for globally accessible styling instructions,

Dev tools & project's commands

Current set of project's commands is:

npm run dev

to build dev environment and host web server,

npm run build

to build prod environment, not hosting web server,

npm run gen

to generate API services to handle backend's endpoints on frontend.