Your First Angular Application With Angular-cli ( part 1 )
Waiting time is over!!
Angular 2.0 is officially released and it is time for all you guys to get some hand-on experience. In this first tutorial I’ll be helping to you to setup your environment and get ready to write your first application.
I don’t want you guys to call it AngularJs anymore because google consider Angular 2.0 as a completely new framework built with the knowledge on Angular 1.x so they want it to be just Angular so let call it Like that from no on.
Lets continue this like this, we will first setup our environment before digging more into Angular because sometime without seeing an output everything else get so boring to understand, then we will slowly catch up everything.
Ok. First things first
- Download and install nodejs
Angular-Cli
The recommended way to setup an Angular project is using the angular-cli tool and that is now ridiculously easy. Just few lines of commands and you are ready to go.
npm install -g @angular/cli
What does this do is it will install ng globally for you so that you can simply use ng command anytime you want. Ok guys we are now officially ready to create our first angular cli application.
I’ll be creating a folder and inside that and then i’ll be creating our first application called “hurray-angular” ( funny name right ? that is because i’m funny too 🙂 )
FYI : you don’t need to actually create a folder you can simply run the command.
mkdir angularProject cd angularProject ng new hurray-angular
Awesome!! after waiting for few minutes 😛 we get our first brand new application ready. now lets run it by visiting the project folder and using ng serve
mkdir angularProject cd hurray-angular ng serve
open up the browser and hit on http://localhost:4200/ hurray! our hurray-angular project is running.. please start clapping!! ok now easy parts are over lets get into business,
I want you guys to familiar with the project structure and the naming conventions that are recommended. and then before we go more further I want you guys to familiar with Typescript which will help us to write ES6 code and transpile them to ES5. Next tutorial will be about these