After tousands of code in Asp.Net projects with DevExpress. When the time is coming for angular 2+ front-end applications, we are ready to go for it.
Couse of that devexpress now supporting angular 2+ for current features like jquery, asp.net, etc. In order to discover and get some experience about dev express with angular. Lets start to visit https://js.devexpress.com/Overview/DataGrid/ page and click "See Demo" options and check them with "Angular" source code tab.
To Start development with angular in real life we need to figure out someting such as download nodejs, gulp, etc.
If you want to follow official steps and get more knowledge instead of faster startup, let visit https://github.com/DevExpress/devextreme-angular/blob/master/README.md
My Steps to test angular2+ with Dev Express
1- Download node.js in offical angular page: https://nodejs.org/en/download/
2- download angular via node console with typing following command in command line
3-Creating new angular project which is calling test-project
4-To build and run project with dev express, we need to install gulp with following command
5- lets install dev express npm module
6- Now we are ready to use any of dev express component.
To say hello world. lets add a dev express button.
- add to dev express button into app.component.html
- add to following function into app.component.ts
- define dev express button into app.module.ts as an import item.
- time to run :)
Couse of that devexpress now supporting angular 2+ for current features like jquery, asp.net, etc. In order to discover and get some experience about dev express with angular. Lets start to visit https://js.devexpress.com/Overview/DataGrid/ page and click "See Demo" options and check them with "Angular" source code tab.
To Start development with angular in real life we need to figure out someting such as download nodejs, gulp, etc.
If you want to follow official steps and get more knowledge instead of faster startup, let visit https://github.com/DevExpress/devextreme-angular/blob/master/README.md
My Steps to test angular2+ with Dev Express
1- Download node.js in offical angular page: https://nodejs.org/en/download/
2- download angular via node console with typing following command in command line
npm install -g @angular/cli
3-Creating new angular project which is calling test-project
ng new test-projectcd test-project
4-To build and run project with dev express, we need to install gulp with following command
npm install --global gulp-cli
5- lets install dev express npm module
npm install --save devextreme devextreme-angular
6- Now we are ready to use any of dev express component.
To say hello world. lets add a dev express button.
- add to dev express button into app.component.html
<dx-button text="Press me" (onClick)="helloWorld()"></dx-button>
- add to following function into app.component.ts
helloWorld() { alert('Hello world!'); }
- define dev express button into app.module.ts as an import item.
import { DxServerTransferStateModule } from 'devextreme-angular'; @NgModule({ ... imports: [ ... DxServerTransferStateModule, ... ] }) export class AppModule {}
- time to run :)
ng serve --open