# Technology Stack Document
Generated: Tuesday, September 16, 2025

## Frontend Technologies

* **Framework:** **Angular**. The boilerplate is built on the latest stable version of the Angular framework, chosen for its robustness, component-based architecture, and suitability for large-scale, enterprise applications.
* **Language:** **TypeScript**. As a superset of JavaScript, TypeScript is used for its strong typing, which improves code quality, maintainability, and developer productivity.
* **Styling:** **SCSS**. SCSS is used for its advanced features over standard CSS, such as variables, nesting, and mixins, allowing for more organized and maintainable stylesheets.
* **UI Framework:** **VMware Clarity Design System**. This comprehensive design system provides a set of accessible, high-quality UI components and a consistent visual language, which accelerates UI development.
* **Core Libraries:**
    * **RxJS:** Used extensively throughout Angular for reactive programming and managing asynchronous operations.
    * **Zone.js:** A signaling mechanism that enables Angular's automatic change detection.

## Backend Technologies

* **Backend Agnostic:** This is a frontend-only boilerplate and is not tied to any specific backend technology. It is designed to communicate with any backend that exposes a RESTful or GraphQL API.

## Database Technologies

* **Not Applicable:** As a frontend project, the boilerplate does not include a database.

## Infrastructure & Deployment

* **Web Server:** The built application consists of static files that can be served by any modern web server (e.g., **Nginx**, **Apache**, **Caddy**).
* **Hosting:** The project can be deployed to any static site hosting provider, such as **Firebase Hosting**, **Netlify**, **Vercel**, **AWS S3**, or **GitHub Pages**.
* **Containerization (Optional):** The application can be easily containerized using **Docker** for consistent deployment environments.

## Development & Build Tools

* **Build Tool:** **Angular CLI**. The command-line interface for Angular is used for creating, building, testing, and deploying the application.
* **Package Manager:** **npm**. The Node Package Manager is used for managing all project dependencies.
* **Version Control:** **Git**. Git is the standard for version control and source code management.
* **Testing:**
    * **Unit Testing:** **Jasmine** (framework) and **Karma** (test runner) are the default tools for unit testing in Angular.
    * **End-to-End (E2E) Testing:** The project can be configured to use **Protractor** or more modern alternatives like **Cypress** or **Playwright**.
* **Code Formatting/Linting:**
    * **ESLint:** Used for identifying and reporting on patterns in ECMAScript/JavaScript code.
    * **Prettier:** An opinionated code formatter that enforces a consistent style.
    * **EditorConfig:** Helps maintain consistent coding styles for multiple developers working on the same project across various editors and IDEs.

---

## TECH STACK UPDATE - 2025-10-02 06:15:22


# Technology Stack Document
Generated: 2025-10-02T[CURRENT_TIMESTAMP]

## Frontend Technologies
-   **Framework:** Angular 16+ (leveraging the base boilerplate)
-   **UI Library/Styling:** VMware Clarity Design System (integrated in boilerplate)
-   **Language:** TypeScript
-   **State Management:** RxJS (built-in with Angular for reactive programming), potentially NgRx for larger state management needs in future phases.
-   **HTTP Client:** Angular's `HttpClient` module
-   **Rich Text Editor:** `@ckeditor/ckeditor5-angular` or similar Angular-compatible WYSIWYG editor library for Phase 2.

## Backend Technologies
-   **Language:** Python 3.9+
-   **Framework:** Flask (a lightweight and flexible microframework for RESTful APIs)
-   **Web Server Gateway Interface (WSGI):** Gunicorn
-   **API:** RESTful API
-   **Authentication:** `Flask-JWT-Extended` for JWT token management
-   **ORM (Object-Relational Mapper):** SQLAlchemy with `Flask-SQLAlchemy` extension
-   **Marshaling/Validation:** `Marshmallow` or `Pydantic` for data serialization/deserialization and request body validation
-   **Request Validation:** `Flask-WTF` for form validation or manual validation using schema libraries

## Database Technologies
-   **Primary Database:** PostgreSQL (a powerful, open-source relational database suitable for scale and complex queries)
-   **Database Driver:** `psycopg2` (for Python-PostgreSQL connection)
-   **Caching (Future Consideration):** Redis (for session management, token blacklisting, or general-purpose caching).

## Infrastructure
-   **Containerization:** Docker (for both frontend and backend services)
-   **Container Orchestration (Production):** Docker Compose (for local development and small-scale deployments), Kubernetes (for enterprise-grade scalability and management)
-   **Hosting:** AWS (Amazon Web Services) - e.g., EC2 for compute, RDS for PostgreSQL, ECR for Docker images, S3 for static assets (if any).

## Development Tools
-   **Version Control:** Git / GitHub / GitLab
-   **Code Editor:** Visual Studio Code (with Angular, Python, Docker extensions)
-   **Frontend Testing:** Karma & Jasmine (unit testing), Cypress/Playwright (e2e testing)
-   **Backend Testing:** Pytest (unit and integration testing)
-   **API Documentation:** Swagger/OpenAPI (e.g., `Flask-RESTX` integration or `Flask-Marshmallow-Swagger`)
-   **CI/CD:** GitHub Actions / GitLab CI / Jenkins (for automated testing, building, and deployment)
-   **Linting/Formatting:** ESLint/Prettier (Angular), Black/Flake8 (Python)



---

## TECH STACK UPDATE - 2025-10-02 06:15:56

# Technology Stack Document
Generated: 2025-10-02T06:14:03.000000

## Frontend Technologies
-   **Framework:** Angular 16+ (leveraging the base boilerplate)
-   **UI Library/Styling:** VMware Clarity Design System (integrated in boilerplate)
-   **Language:** TypeScript
-   **State Management:** RxJS (built-in with Angular for reactive programming), potentially NgRx for larger state management needs in future phases.
-   **HTTP Client:** Angular's `HttpClient` module
-   **Rich Text Editor:** `@ckeditor/ckeditor5-angular` or similar Angular-compatible WYSIWYG editor library for Phase 2.

## Backend Technologies
-   **Language:** Python 3.9+
-   **Framework:** Flask (a lightweight and flexible microframework for RESTful APIs)
-   **Web Server Gateway Interface (WSGI):** Gunicorn
-   **API:** RESTful API
-   **Authentication:** `Flask-JWT-Extended` for JWT token management
-   **ORM (Object-Relational Mapper):** SQLAlchemy with `Flask-SQLAlchemy` extension
-   **Marshaling/Validation:** `Marshmallow` or `Pydantic` for data serialization/deserialization and request body validation
-   **Request Validation:** `Flask-WTF` for form validation or manual validation using schema libraries

## Database Technologies
-   **Primary Database:** PostgreSQL (a powerful, open-source relational database suitable for scale and complex queries)
-   **Database Driver:** `psycopg2` (for Python-PostgreSQL connection)
-   **Caching (Future Consideration):** Redis (for session management, token blacklisting, or general-purpose caching).

## Infrastructure
-   **Containerization:** Docker (for both frontend and backend services)
-   **Container Orchestration (Production):** Docker Compose (for local development and small-scale deployments), Kubernetes (for enterprise-grade scalability and management)
-   **Hosting:** AWS (Amazon Web Services) - e.g., EC2 for compute, RDS for PostgreSQL, ECR for Docker images, S3 for static assets (if any).

## Development Tools
-   **Version Control:** Git / GitHub / GitLab
-   **Code Editor:** Visual Studio Code (with Angular, Python, Docker extensions)
-   **Frontend Testing:** Karma & Jasmine (unit testing), Cypress/Playwright (e2e testing)
-   **Backend Testing:** Pytest (unit and integration testing)
-   **API Documentation:** Swagger/OpenAPI (e.g., `Flask-RESTX` integration or `Flask-Marshmallow-Swagger`)
-   **CI/CD:** GitHub Actions / GitLab CI / Jenkins (for automated testing, building, and deployment)
-   **Linting/Formatting:** ESLint/Prettier (Angular), Black/Flake8 (Python)
