Key points to build an Angular application


This Blog is about Angular and why developers should choose angular to build an application. And we will also discuss difference between its current version and previous versions.

What Angular is :

Angular is perfect choice for Single Page Application(SPAs). AngularJS takes another approach. AngularJS is a structural framework for dynamic web apps. It tries to make something as small as possible the impedance mismatch between document centric HTML and what an application needs by creating new HTML constructs. AngularJS teaches the browser new syntax through a construct we call directives.

Why Angular :

Image result for why angularjs

  • Integration: It is easy to unified third party features with AngularJS as Angular integration comes pre-built into frameworks such as Telerik’s Kendo UI, Ionic, Wijmo and others.

However, this is one of the most essential factors to heave AngularJS for enterprise development for the integration of Angular into other frameworks and tools.

  • Security: When we talk about enterprise development or transformation to a new leading technology framework, security is the main and top most concern. And now more than ever enterprises are focusing more on data security, easy access to their channels, distributors and sales team. Evidently, they have to look for a complete solution that can power enterprise processes and business.
  • Data Binding: This is the best concept with two-way binding in AngularJS and we would like to introduce it as an eye candy feature.
  • Not So Much Coding: Developers need to spend less time in coding process as AngularJS requires less coding. Without any doubt it is a great deal for developers.A glance where it asks for fewer codes:
    • AngularJS developers community don’t require to write their own pipeline
    • Its data model is very simple and developers don’t need any getter/setter functions
    • Its data-binding feature grants developers to stop giving data manually into the view
    • AngularJS is defined using HTML for view to make it more specific
    • As directives are deifferent from app code, other teams can write it without any integration issue.
    • Filters allow developer to manipulate the data on the view level without doing any changing of your controllers
    • AngularJS has a built-in dependency injection subsystem convenient for developers for making applications in an easier way including testing process as well.
  • Painless Testing: The codes that are written in JavaScript are necessary to follow a series of tests. Because we know that JavaScript is interpreted, dynamic and not compiled.
  • Declarative User Interface: For defining app’s UI AngularJS uses HTML, which is a declarative, intuitive and less convoluted language than defining an interface in JavaScript.
    You should stop spending time on program flows and what loads first, simply define what you need, Angular will deliver the rest.

Latest Version of Angluar is 4.x . So we should differentiate how it is different from previous versions.

Difference between Angular 4 and  2

  • Angular 4 reduce the size of the generated code for your components by around 60% in most cases
  • Faster Compilation
  • Better Bug fixes Alert

  • Some changes in Imports/Syntax
  • Improved *ngIf and *ngFor : Developers can use else clause as well

    <div *ngIf="employeeList | async as employees; else loading">
     <employee-profile *ngFor="let employee of employees; count as count; index as i" [employee]="employee"> Employee {{i}} of {{count}}
     </employee-profile>
    </div>
    
    <ng-template #loading>Loading...</ng-template>
    
  • TypeScript 2.1 and 2.2 compatibility: Finally We can use typescript 2.1 or more earlier only upto typescript 1.8 was supported
  • Animation package : They have pulled animations out of @angular/core and into their own package. This means that if you don’t use animations, this extra code will not end up in your production bundles.

  • Source Maps for Templates : Now when there is an error caused by something in one of Developers templates, they generate source maps that give a meaningful context in terms of the original template.

Difference between Angular 2 and  1

  • Framework changes : Curly braces now denote a one-way binding. If you recall, this is the equivalent of using ng-bind in Angular 1. In Angular 2 you’re required to use parentheses inside of brackets (known as “banana in a box“) for two way data binding.
    Example :

    <!-- Two way binding -->
    <!-- Angular 1 -->
    <div>{{ message }}</div>
    <!-- Angular 2 -->
    <div [(ngModel)]="message"></div>
    
  • Many basic directives, filters, and services do not exist until they have been imported!

  • bye bye ng-app, hello Bootstrap : We no longer use the ng-app attribute to connect an Angular App. Instead, we have to depend on a new technique known as Bootstrapping.
    import { bootstrap } from '@angular/platform-browser-dynamic';
    import { AppComponent } from './app.component'; 
    // Connect the component to our view 
    bootstrap(AppComponent);
  • Controllers no longer exist: Instead we use Components to manage our views.

So, in this blog we discussed what angular is where to use it  And why we select angular to create an application. Difference between its latest version and previous version.

Hope this gave you a brief idea about angular .  🙂

Reference: Why-Angular
Angular
Like it & Share it    like share

KNOLDUS-advt-sticker

Advertisements
This entry was posted in Scala and tagged , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s