Update frontend/angular-clarity-master/README.txt
This commit is contained in:
parent
dbc43211e0
commit
86612c78c9
@ -1,83 +1,202 @@
|
|||||||
# Angular Clarity Boilerplate
|
# Angular Clarity Boilerplate
|
||||||
|
|
||||||
This project is an Angular boilerplate application that uses the [Clarity Design System](https://clarity.design/) by VMware. It serves as a starter template for building modern, responsive, and feature-rich web applications.
|
This project is an Angular boilerplate application that uses the [Clarity Design System](https://clarity.design/) by VMware. It serves as a starter template for building modern, responsive, and feature-rich web applications.
|
||||||
|
|
||||||
This boilerplate is pre-configured with a standard project structure and includes essential modules and components to kickstart your development process.
|
This boilerplate is pre-configured with a standard project structure and includes essential modules and components to kickstart your development process.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🚀 Features
|
## 🚀 Features
|
||||||
|
|
||||||
* **Angular:** The latest version of the Angular framework.
|
* **Angular:** The latest version of the Angular framework.
|
||||||
* **Clarity Design System:** A comprehensive set of UX guidelines, HTML/CSS components, and Angular components.
|
* **Clarity Design System:** A comprehensive set of UX guidelines, HTML/CSS components, and Angular components.
|
||||||
* **Responsive Layout:** A responsive navigation and layout structure.
|
* **Responsive Layout:** A responsive navigation and layout structure.
|
||||||
* **Scalable Architecture:** A well-organized and scalable project structure.
|
* **Scalable Architecture:** A well-organized and scalable project structure.
|
||||||
* **Theming:** Easily customizable themes (light and dark).
|
* **Theming:** Easily customizable themes (light and dark).
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🛠️ Getting Started
|
## 🛠️ Getting Started
|
||||||
|
|
||||||
Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.
|
Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.
|
||||||
|
|
||||||
### Prerequisites
|
### Prerequisites
|
||||||
|
|
||||||
Make sure you have [Node.js](https://nodejs.org/) and the [Angular CLI](https://angular.io/cli) installed on your system.
|
Make sure you have [Node.js](https://nodejs.org/) and the [Angular CLI](https://angular.io/cli) installed on your system.
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
npm install -g @angular/cli
|
npm install -g @angular/cli
|
||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
Install the dependencies:
|
Install the dependencies:
|
||||||
npm install
|
npm install
|
||||||
|
|
||||||
Running the Application
|
Running the Application
|
||||||
Run the following command to start the development server:
|
Run the following command to start the development server:
|
||||||
ng serve
|
ng serve
|
||||||
|
|
||||||
The app will automatically reload if you change any of the source files.
|
The app will automatically reload if you change any of the source files.
|
||||||
|
|
||||||
|
|
||||||
## DEPENDENCIES
|
## DEPENDENCIES
|
||||||
|
|
||||||
This project includes the following main dependencies:
|
This project includes the following main dependencies:
|
||||||
|
|
||||||
@angular/animations: The Angular animations library.
|
@angular/animations: The Angular animations library.
|
||||||
@angular/common: Commonly needed services, pipes, and directives.
|
@angular/common: Commonly needed services, pipes, and directives.
|
||||||
@angular/compiler: The Angular template compiler.
|
@angular/compiler: The Angular template compiler.
|
||||||
@angular/core: Core Angular framework.
|
@angular/core: Core Angular framework.
|
||||||
@angular/forms: Angular's form validation and handling library.
|
@angular/forms: Angular's form validation and handling library.
|
||||||
@angular/platform-browser: Everything needed to run Angular in a web browser.
|
@angular/platform-browser: Everything needed to run Angular in a web browser.
|
||||||
@angular/router: The Angular router for navigation.
|
@angular/router: The Angular router for navigation.
|
||||||
@cds/core: Clarity Design System core components.
|
@cds/core: Clarity Design System core components.
|
||||||
@clr/angular: Angular components for Clarity.
|
@clr/angular: Angular components for Clarity.
|
||||||
@clr/ui: HTML/CSS components for Clarity.
|
@clr/ui: HTML/CSS components for Clarity.
|
||||||
rxjs: Reactive extensions for JavaScript.
|
rxjs: Reactive extensions for JavaScript.
|
||||||
zone.js: A signaling mechanism for Angular that allows it to detect when to run change detection.
|
zone.js: A signaling mechanism for Angular that allows it to detect when to run change detection.
|
||||||
|
|
||||||
|
|
||||||
📂 Project Structure
|
📂 Project Structure
|
||||||
/
|
/
|
||||||
├── .vscode/ # VSCode settings
|
├── .vscode/ # VSCode settings
|
||||||
├── node_modules/ # Node.js modules
|
├── node_modules/ # Node.js modules
|
||||||
├── src/ # Application source code
|
├── src/ # Application source code
|
||||||
│ ├── app/ # Application components and modules
|
│ ├── app/ # Application components and modules
|
||||||
│ │ ├── core/ # Core module (singleton services, guards, etc.)
|
│ │ ├── core/ # Core module (singleton services, guards, etc.)
|
||||||
│ │ ├── shared/ # Shared module (common components, pipes, etc.)
|
│ │ ├── shared/ # Shared module (common components, pipes, etc.)
|
||||||
│ │ ├── app-routing.module.ts
|
│ │ ├── app-routing.module.ts
|
||||||
│ │ ├── app.component.html
|
│ │ ├── app.component.html
|
||||||
│ │ ├── app.component.scss
|
│ │ ├── app.component.scss
|
||||||
│ │ └── app.module.ts
|
│ │ └── app.module.ts
|
||||||
│ ├── assets/ # Static assets (images, icons, etc.)
|
│ ├── assets/ # Static assets (images, icons, etc.)
|
||||||
│ ├── environments/ # Environment-specific configuration
|
│ ├── environments/ # Environment-specific configuration
|
||||||
│ ├── index.html # Main HTML file
|
│ ├── index.html # Main HTML file
|
||||||
│ ├── main.ts # Main entry point
|
│ ├── main.ts # Main entry point
|
||||||
│ └── styles.scss # Global styles
|
│ └── styles.scss # Global styles
|
||||||
├── .editorconfig # Editor configuration
|
├── .editorconfig # Editor configuration
|
||||||
├── .gitignore # Git ignore file
|
├── .gitignore # Git ignore file
|
||||||
├── angular.json # Angular CLI configuration
|
├── angular.json # Angular CLI configuration
|
||||||
├── package.json # Project dependencies and scripts
|
├── package.json # Project dependencies and scripts
|
||||||
├── README.md # This README file
|
├── README.md # This README file
|
||||||
└── tsconfig.json # TypeScript configuration
|
└── tsconfig.json # TypeScript configuration
|
||||||
|
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## ✅ What’s already built in this codebase (with file locations)
|
||||||
|
|
||||||
|
### Authentication & Login
|
||||||
|
- Login page (UI + logic):
|
||||||
|
- src/app/modules/login/login-page/login-page.component.html
|
||||||
|
- src/app/modules/login/login-page/login-page.component.ts
|
||||||
|
- src/app/modules/login/login-page/login-page.component.spec.ts
|
||||||
|
- Login routing + module:
|
||||||
|
- src/app/modules/login/login-routing.module.ts
|
||||||
|
- src/app/modules/login/login.module.ts
|
||||||
|
- Auth services:
|
||||||
|
- src/app/services/api/login.service.ts
|
||||||
|
- src/app/services/auth_guard.service.ts
|
||||||
|
- src/app/services/jwt.interceptor.ts
|
||||||
|
- Account flows:
|
||||||
|
- Forgot/reset password: src/app/modules/login/forgotresetpassword/forgotresetpassword.component.html
|
||||||
|
- Forgot/reset password (alt): src/app/modules/login/forgotresetpassword1/forgotresetpassword1.component.html
|
||||||
|
- Email verification: src/app/modules/login/emailverification/emailverification.component.{ts,html}
|
||||||
|
- Add guest: src/app/modules/login/addguest/addguest.component.html
|
||||||
|
- About work: src/app/modules/login/about-work/about-work.component.{ts,html}
|
||||||
|
|
||||||
|
### Shell, Layout, Navigation (Menus/Sidebar/Topbar)
|
||||||
|
- Application shell and layout (includes navbar/sidebar containers):
|
||||||
|
- src/app/modules/main/layout/layout.component.{ts,html,scss}
|
||||||
|
- Main module + routing:
|
||||||
|
- src/app/modules/main/main.module.ts
|
||||||
|
- src/app/modules/main/main-routing.module.ts
|
||||||
|
- Menu models and admin menu management:
|
||||||
|
- Models: src/app/models/builder/Rn_Main_Menu.ts, src/app/models/builder/Rn_Sub_Menu.ts, src/app/models/builder/Rn_Fb_Header.ts
|
||||||
|
- Services: src/app/services/admin/menu-register.service.ts, src/app/services/admin/menu-group.service.ts, src/app/services/admin/menumaintance.service.ts
|
||||||
|
- Components (CRUD):
|
||||||
|
- src/app/modules/main/admin/menu-register/* (add/edit/all/readonly)
|
||||||
|
- src/app/modules/main/admin/menu-group/* (all/edit/read-only)
|
||||||
|
- src/app/modules/main/admin/menumaintance/menumaintance.component.{ts,html}
|
||||||
|
- src/app/modules/main/admin/submenu/submenu.component.{ts,html}
|
||||||
|
- src/app/services/api/realnet-menu.service.ts
|
||||||
|
|
||||||
|
### User & Access Management
|
||||||
|
- User management (list/add/edit/profile/settings, groups):
|
||||||
|
- src/app/modules/main/admin/user/user.component.{ts,html}
|
||||||
|
- src/app/modules/main/admin/usermaintance/usermaintance.component.{ts,html}
|
||||||
|
- src/app/modules/main/admin/usermaintanceadd/usermaintanceadd.component.{ts,html}
|
||||||
|
- src/app/modules/main/admin/usermaintanceedit/usermaintanceedit.component.{ts,html}
|
||||||
|
- src/app/modules/main/admin/usergrpmaintenance/usergrpmaintenance.component.ts
|
||||||
|
- src/app/modules/main/admin/profile-setting/profile-setting.component.html
|
||||||
|
- Services: src/app/services/admin/usermaintance.service.ts, src/app/services/admin/usergrpmaintaince.service.ts, src/app/services/admin/user-profile.service.ts, src/app/services/admin/user-registration.service.ts
|
||||||
|
- Access types / permissions:
|
||||||
|
- src/app/modules/main/admin/accesstype/accesstype.component.{ts,html}
|
||||||
|
- src/app/services/admin/accesstype.service.ts
|
||||||
|
- Guard: src/app/services/auth_guard.service.ts
|
||||||
|
|
||||||
|
### System Administration & Configuration
|
||||||
|
- System parameters, health, logs, connectors, webhooks:
|
||||||
|
- System parameters: src/app/modules/main/admin/systemparameters/systemparameters.component.html; service: src/app/services/admin/sysparameter.service.ts
|
||||||
|
- Health checkup: src/app/services/admin/health-checkup.service.ts
|
||||||
|
- Session logger UI: src/app/modules/main/admin/sessionlogger/sessionlogger.component.html; service: src/app/services/admin/sessionlogger.service.ts
|
||||||
|
- Connectors & mapping: src/app/services/admin/sure-connector.service.ts, src/app/services/admin/connector-mapping.service.ts
|
||||||
|
- Outgoing webhooks: src/app/services/admin/outgoingwebhook.service.ts
|
||||||
|
- Audit reporting: src/app/services/admin/auditreport.service.ts; API: src/app/services/api/audittrail.service.ts
|
||||||
|
- Deployment profile: src/app/services/admin/deploymentprofile.service.ts
|
||||||
|
|
||||||
|
### Foundation (FND) and Data Management
|
||||||
|
- Token registry:
|
||||||
|
- src/app/modules/main/fnd/Token_registery/Token_registery.component.{ts,html}
|
||||||
|
- src/app/modules/main/fnd/Token_registery/Token_registery.service.ts
|
||||||
|
- API registry (CRUD + lines):
|
||||||
|
- src/app/modules/main/fnd/apiregistery/apiregistery.component.{ts,html}
|
||||||
|
- src/app/modules/main/fnd/apiregistery/allapiregistery/allapiregistery.component.{ts,html}
|
||||||
|
- src/app/modules/main/fnd/apiregistery/Apiregisteryline/Apiregisteryline.component.{ts,html}
|
||||||
|
- Sequence generator:
|
||||||
|
- src/app/modules/main/fnd/sequencegenarator/sequencegenarator.component.{ts,html}
|
||||||
|
- Extensions:
|
||||||
|
- src/app/modules/main/fnd/extension/* (add/edit/all/components)
|
||||||
|
- Document master:
|
||||||
|
- src/app/modules/main/admin/documentmaster/documentmaster.component.{ts,html}
|
||||||
|
- Data management (bulk import, mapping rules):
|
||||||
|
- Bulk import: src/app/modules/main/datamanagement/bulkimport/**/*.{ts,html}
|
||||||
|
- Mapping rules: src/app/modules/main/datamanagement/mappingrule/**/*.{ts,html}
|
||||||
|
- Services: src/app/services/fnd/bulkimport.service.ts, src/app/services/fnd/datamanagement.service.ts
|
||||||
|
|
||||||
|
### Reporting & Dashboards
|
||||||
|
- Report builder and runner (multiple generations):
|
||||||
|
- Builder: src/app/modules/main/builder/report-build/**/*.{ts,html}
|
||||||
|
- Builder v2: src/app/modules/main/builder/report-build2/**/*.{ts,html}
|
||||||
|
- Runner: src/app/modules/main/builder/report-runner/**/*.{ts,html}
|
||||||
|
- Dashboard (new + runner): src/app/modules/main/builder/dashboardnew/**/*, src/app/modules/main/builder/dashboardrunner/**/*
|
||||||
|
- Services: src/app/services/api/report-builder.service.ts, src/app/services/builder/*.ts
|
||||||
|
|
||||||
|
### Query (Super Admin)
|
||||||
|
- Query management:
|
||||||
|
- src/app/modules/main/superadmin/query/**/*.{ts,html}
|
||||||
|
- src/app/modules/main/superadmin/queryadd/queryadd.component.ts
|
||||||
|
- src/app/modules/main/superadmin/queryedit/queryedit.component.ts
|
||||||
|
- API: src/app/services/api/query-runner.service.ts
|
||||||
|
|
||||||
|
### Shared Utilities
|
||||||
|
- Pipes:
|
||||||
|
- src/app/pipes/*.ts (e.g., search-filter.pipe.ts, thai-date*.pipe.ts, time-pipe.pipe.ts, sanitize.pipe.ts)
|
||||||
|
- Notifications/Alerts services:
|
||||||
|
- src/app/services/notification.service.ts, src/app/services/alerts.service.ts, src/app/services/fnd/alerts.service.ts
|
||||||
|
- CSV/Excel helpers:
|
||||||
|
- src/app/services/csv.service.ts, src/app/services/excel.service.ts
|
||||||
|
- i18n assets:
|
||||||
|
- src/assets/i18n/en.json, src/assets/i18n/hi.json
|
||||||
|
- App-level routing + module:
|
||||||
|
- src/app/app-routing.module.ts
|
||||||
|
- src/app/app.module.ts
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Quick Start (recap)
|
||||||
|
1. npm install -g @angular/cli
|
||||||
|
2. npm install
|
||||||
|
3. ng serve
|
||||||
|
|
||||||
|
This project already includes: authentication flow, guarded routes, admin menus and access, user and group management, system configuration screens, FND (token/api registry, sequences, extensions), data management (bulk import, mapping rules), reporting and dashboards, super-admin queries, shared utilities (pipes, alerts, CSV/Excel), i18n scaffolding, and a Clarity-based layout and navigation.
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user