Skip to content

Latest commit

 

History

History
63 lines (53 loc) · 2.67 KB

File metadata and controls

63 lines (53 loc) · 2.67 KB

Angular-dashboard-layout-dynamic-components

Repository Description
This repository contains an Angular sample application generated using Angular CLI that demonstrates how to build dynamic dashboard layouts using Angular components.

The project serves as a foundational Angular setup that can be extended to integrate advanced layout components such as dashboards with movable and resizable panels.

Project Overview

The purpose of this project is to provide a basic Angular application structure that can support dynamic dashboard layouts. It is intended to help developers understand how Angular components can be organized and managed in a dashboard‑style layout.

Features

  • Angular CLI–generated project structure
  • Development server with live reload
  • Support for component‑based dashboard layouts
  • Build and test workflows configured using Angular CLI

Prerequisites

Ensure the following tools are installed before running this project:

  • Node.js
  • Angular CLI
  • Visual Studio Code

Installation and Running the Application

Development Server

Run the following command to start the development server:

ng serve

Navigate to: http://localhost:4200/ The application will automatically reload if you change any of the source files.

Code Scaffolding

Generate new Angular components or other building blocks using:

ng generate component component-name

You can also generate directives, pipes, services, classes, guards, interfaces, enums, and modules.

Build

Run the following command to build the project:

ng build

The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Testing

  • Unit Tests: Run ng test to execute unit tests via Karma.
  • End‑to‑End Tests: Run ng e2e to execute end‑to‑end tests via Protractor.

Documentation

Troubleshooting

  • Ensure Node.js and Angular CLI versions are compatible.
  • Restart the development server if changes are not reflected.
  • Review browser console output for runtime or configuration errors.

Support

  • For Angular CLI usage details, run ng help or refer to the Angular CLI README.
  • For dashboard layout features and configuration guidance, refer to the Syncfusion Angular documentation links above.