Get Started with Ignite UI Components for Native Angular Applications

Getting Started

Enjoy the very best out of Ignite UI for Angular

To start using Ignite UI for Angular, you need an active trial or commercial license to Ignite UI, Infragistics Pro or Ultimate.

A complete list of the Angular Components

Browse Components

This download does not include the complete set of documentation and step-by-step guides with API documentation.

See Documentation

Prerequisites to using Ignite UI for Angular

Before you can run Ignite UI for Angular, there are 2 steps to get everything on your machine set up to run any Angular app, including Ignite UI for Angular, and to build Ignite UI for Angular apps.

To get started, you must install both NodeJS and Visual Studio Code on your machine. Modern web development with Angular requires NodeJS, it’s sort of like an ASP.NET app running in the browser requires ASP.NET runtime deployed on the server. For development, there is nothing better than Visual Studio Code to build Angular apps. Getting started is easy, just download and install both Node.js and Visual Studio Code.

Download Node

Download VS Code

Running the Ignite UI for Angular Samples

Once the prerequisites are installed, you can get the Ignite UI for Angular samples running with the step-by-step below or you can watch this quick video.

Step-by-Step

Unzip the package to your hard drive
Open the project by right-clicking anywhere in the folder that you’ve just unzipped and selecting “Open with Code” from the context menu. If you do not have a right-click option to Open in Code, or you are running a Mac, simply open Visual Studio Code and from the File menu select Open Folder and select the folder you just unzipped.
Once Visual Studio Code is open, you should see the samples folders in the Explorer pane.
In Visual Studio Code, from the “View” menu, select “Integrated Terminal”.
Type
```
npm install
```
at the command line in the integrated terminal.
Once the
```
npm install
```
completes, type npm start at the command line in the integrated terminal.
Your browser should open to http://localhost:4200 with the Ignite UI for Angular samples running.

Add Ignite UI for Angular to an existing app

If you already have an existing Angular CLI project, you can automatically add Ignite UI for Angular to it with all the necessary dependencies, font imports and styles references by typing the following command:

ng add igniteui-angular

After the installation has finished, we can now execute Ignite UI CLI commands (more details on that below) in our updated application in order to further enrich it by using Ignite UI for Angular components!

Building your first Ignite UI for Angular app

After you’ve looked at the Ignite UI for Angular samples and explored the online docs, it’s time to get started building your first Ignite UI for Angular app. Using the Ignite UI for Angular CLI (Command Line Interface), it’s super-easy to get started building full-featured Angular apps. Our CLI gives you the ability to initialize, develop, scaffold, and maintain applications in Angular with Ignite UI, all with pre-set navigation, templates for each control and full screen views that can help you kick off any type of Angular app development.

We’ve included 2 videos that will help you install the pre-requisites and walk you through using the Ignite UI for Angular CLI to build your first Ignite UI for Angular app.

Installing the Ignite UI for Angular CLI

Building Your First Ignite UI CLI App

If you are already familiar with node.js and using a CLI, you can skip the videos and type:

npm install igniteui-cli –g

in Terminal, PowerShell or Bash to install our CLI. We include an alias, so just type:

ig

to get started with the wizard, or type:

ig -v

to check the version or to get a list of commands, type:

ig -h

Need Help? Look to our Ignite UI for Angular Forum

To get further help if you need it, or if you run into any issues, go to the forums.

Ignite UI for Angular Forums