Thursday, 17 November 2022

Angular #1 Installation

Why named it as Angular. b'cos it is written between < > !

 Angular is typescript for building client applications framework.

Angular is easier, clean loosely coupled architecture and more testable and reusable.

Architecture: (FE+BE)

Front End  (UI): Client (Browser) use HTML CSS( Templates) , Type Script (Extended Java Script), angular

Back End  (Data Processing):  Data + API (Application Programming Interface) + Business Logic

Simply, Angular makes life easier!

Angular Version is known as AngularJS. Later versions are known As Angular V x. (latest is Angular 14.0)

Difference between AngularJS and Angular

Architecture :      MVC Model vs  Components and Directives

Language     :      Java Script vs Type Script

Mobile          :    Not Mobile friendly vs Mobile Friendly

Expression Syntax : {{}} vs () []

Dependency Injection : Not used vs Hierarchical DI is used

Routing     :     @routProvider  vs @Route configuration

Code         :      Unmanageable vs Structured


1. First Angular Project:

Download latest stable version node.js from nodejs.org depending on your platform (Windows-32/64/Mac/Linux) (in my case downloaded windows 64 bit node-v18.12.1-x64.msi on 17.11.2022). Install as Administrator. Check  in command prompt by this command

            node --version

Download Angular CLI (Command Line Interface) tool by this command 

            npm install -g @angular/cli

Check in command prompt by this command 

            ng version

Create angular project in command prompt:

            ng new hello-universe  where hello-universe is angular project name.
            Will ask some questions like: 
             Ans 'N' for Would you like to add Angular routing? y/n -
             Select 'CSS' for ? Which stylesheet format would you like to use? 
            will take some time to create necessary files for the angular project

 Download beautiful cross platform code editor: Visual Studio  from https://code.visualstudio.com/download to get VSCodeUserSetup.exe and install as Administrator. 

Go to hello-universe directory. type the following command to check the visual code editor

            code .

 You can observe the Visual studio IDE opened with HELLO-UNIVERSE project. Now our first Angular Project is ready. We can run by this in command prompt 

            ng serve

will build  and display message Compiled successfully at the end.

Now open the browser and type in the address bar

           localhost:4200

Your first application will show screen like this 


Great My friend, You have done it!






        

    


 











No comments:

Post a Comment

Making Prompts for Profile Web Site

  Prompt: Can you create prompt to craft better draft in a given topic. Response: Sure! Could you please specify the topic for which you...