NobleUI - Angular Admin Dashboard Template Documentation (v1.1.1)

Thank you so much for purchasing NobleUI Angular Admin Dashboard Template. If you have any questions that are beyond the scope of this documentation, please feel free to email to :)


NobleUI Angular Admin is a responsive Angular 11 template that is based on the CSS framework Bootstrap 4 and it is built with SASS. SASS compiler makes it easier to code and customize. It's No jQuery Dependency angular admin template including all feature and functionality with ease of integration for your project. If you are unfamiliar with Bootstrap or SASS, visit their website and read through the documentation. All of Bootstrap components have been modified to fit the style of NobleUI and provide a consistent look throughout the template.

What's include

NobleUI comes with a simple and logically organized file structure for easy to understand and maintainability.We have included 4 demos (Light, Dark, Horizontal-menu and RTL).


Set up the Development Environment

1. Install Node.js and npm if they are not already on your machine.

2. Angular CLI is a command line interface for the latest Angular. Install it before start with the Angular app.

If you have Angular CLI installed previously, update it to the latest Angular CLI. Remove the older version and re-install it.

Template Installation

Navigate to the project folder (demo1, demo2, demo3 or demo4)


Then run npm install. This command install the dependencies in the local node_modules folder. By default, npm install will install all modules listed as dependencies in package.json.

The ng serve command launches the server, watches your files, and rebuilds the app as you make changes to those files. Using the --open (or just -o) option will automatically open your browser on http://localhost:4200/.


For the simplest deployment, create a production build and copy the output directory to a web server.

1. Start with the production build:

2. Copy everything within the output folder (dist/) to a folder on the server.

3. Configure the server to redirect requests for missing files to index.html.

If you copy the files into a server sub-folder, append the build flag, --base-href and set the <base href> appropriately. For example, if the index.html is on the server at /my/app/index.html, set the base href to <base href="/my/app/"> like this.

If you're serving the app out of a subfolder, edit a version of index.html to set the base href appropriately. For example, if the URL to index.html is, set the base href to:

Learn more about the role of <base href> below.

You also can set the base href right in the ng build command

For more detailed information, visit this official Angular documentation website.


We are here to assist you, thank you for report any bug/issue to our email

© 2021. NobleUI Documentation v1.1.1 . All Rights Reserved. Created by: NobleUI