Java Topics

Angular Basics

Angular Introduction

  • Angular is a great Framework which is used to build interactive elements and components of a website.
  • Angular is a Framework which is used to develop for both frontend and backend development.
  • Angular is hot and huge demand Framework for any web development.
  • Angular is a Javascript Framework which allows to create reactive single page applications(SPAS) like web applications.
  • Angular is written in Typescript by Google company.
Why Angular becomes very popular ?

✓Because of it's Functionality, Features & BenefitsSystem it is becomes very popular.

What is Single Page Application ?

✓A web application or website that interacts with the user by dynamically rewriting the current page rather than loading entire new page from a server.

✓ one of the best example is Gmail.

✓ All top class company using single page application like Spotify, Twitter, Gmail ,Google Maps,Netflix.

TypeScript Explanation :

✓Typescript is JavaScript + Some additional features.
✓ Typescript is strongly typed, object-oriented and compiled language.

Prerequisites for Angular :

 For Prerequisites We need to know about the following skillsets

✓ HTML 5
✓ CSS 3
✓ JAVA SCRIPT

Angular Versions :










Angular JS contains 1.0, 1.1, 1.2,....................,1.7

Angular contains    2.0, 4.0, 5.0, 6.0, 7.0, ........

Both Angular JS and Angular are different, there is no relation between both. Angular is completely Re-write .

Angular (vs) Angular JS :

 

Angular JS

Angular

1.The official website of Angular Js is https://angularjs.org/

1.The official website of Angular is https://angular.io/

2.The Atrchitecture of AngularJs is Based on MVC or MVW

2.The Architecture of Angular is Based on components as it primary Architectural Characteristic.

3. AngularJs uses terms if Scope and Controller.

3.Angular uses a Hierarchy of Components & Directives.

4. Angular JS contains  1.0,1.1,1.2,....................,1.7

 

4. Angular contains 2.0, 4.0, 5.0, 6.0, 7.0, .......

 

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             

Angular (vs) REACT :


Technology

Angular

React

Created By

Google

Facebook

Technology Type

Component-Based Framework using Typescript

User Interface Library with a component-based architecture using JavaScript

Data Binding

2-way data binding

1-way data binding

Size

Quite large & since it needs to be shipped to the client side, it increases the initial load time

Quite small in size, especially when compared with Angular

Learning Curve

Quite Sleep, given the number of features & options you have in angular

Its easy to pick up and learn

Simplicity

Quite complex

Fairly simple but takes some time to set up a project and configure everything

         

Basic Architecture of Angular :            


   

What is a MODULE ?

Module is nothing but JavaScript or typescript code.

which is going to have variables, functions, class further we import and exports.

Module is  .jS or .ts Files.





 Module in Angular refers to a place where you can Group the Components, Directives, Pipes & Services which are related to the application.

 Every Angular application have atleast One Module, which is called RouteModule and it's naming convection is AppModule.

 It reside inside the App.Module.ts file.

What is a COMPONENT ?

✓ Major part of the Development is Done in the Components.

✓ Components Control the portion of the View in the Browser.

✓ Components are basically Classes that interact with the .html file of the Component, which gets displayed on the Browser.

✓ Every Angular application has atleast One component which is Root Component & by convention it is AppComponent.









Summarize the Architecture :

✓ Angular Application : One or More Modules

✓ Module : Html Template + Class to control the logic to the particular View.

✓ Service : Business Logic.

✓ Finally, Modules interact with each other and render view in the Browser.

Next, For Installation of Angular you can Click here to follow the steps in your machine.