angular-material-template — Angular Admin dashboard Template

SHA-256: 04fcf12c67d2402bcea5684361bb08c9f9428cd57ea4aa18d2f7a94c8e289cea

2026-09-30T11:55:11.085Z

[![Build status](https://dev.azure.com/umutesen/onthecode/_apis/build/status/Material%20Template%20CI)](https://dev.azure.com/umutesen/onthecode/_build/latest?definitionId=11)

 # Angular Material Starter Template

 ![Product Gif](https://github.com/umutesen/angular-material-template/blob/media/material-template-demo.gif)


Angular Material Starter Template is a free template built with Angular  and Angular Material. You can use it out of the box without having to change any file paths. Everything you need to start development on an Angular project is here.

Angular Material starter template has been built with the official style guide in mind, which means it promotes a clean folder structure and separation of concerns. The material template is fully responsive and contains the fundamental building blocks of a scalable Angular application:

Authentication module with login, logout and password reset components
Responsive Admin dashboard with sidebar
Account area with change password component
All Angular Material components
In addition to Angular, other well-known open-source libraries such as rxjs, moment and ngx-logger are also included.

This application template came as a result of several applications that I have developed over the past few years. 

Having mostly used Angular Material component, I wanted to create a starter template to save time for greenfield projects. I developed it based on user feedback and it is a powerful Angular admin dashboard, which allows you to build products like admin panels, content management systems (CMS) and customer relationship management (CRM) software.

## Starter Template Features

Clean folder structure
Core module
Shared module
Example feature modules
Lazy-loaded feature modules
Global error-handling
Error logging with ngx-logger (logging to browser & remote API)
HTTP Interceptors to inject JWT-tokens Authentication and role guards (for Role-based access)
Shows spinner for all HTTP requests
Angular flex layout
Browser Support

At present, the template aims to support the last two versions of the following browsers:

Chrome
Firefox
Microsoft Edge
Safari
Opera


## Development server

Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.

## Code scaffolding

Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.

## Build

Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.

## Running unit tests

Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Running end-to-end tests

Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.