AngularJS is not a single piece in the overall puzzle of building the client-side of a web application. It handles all of the DOM and AJAX glue code you once wrote by hand and puts it in a well-defined structure. This makes AngularJS opinionated about how a CRUD (Create, Read, Update, Delete) application should be built. But while it is opinionated, it also tries to make sure that its opinion is just a starting point you can easily change. AngularJS comes with the following out-of-the-box:
- Everything you need to build a CRUD app in a cohesive set: Data-binding, basic templating directives, form validation, routing, deep-linking, reusable components and dependency injection.
- Testability story: Unit-testing, end-to-end testing, mocks and test harnesses.
- Seed application with directory layout and test scripts as a starting point.
- Angular help developer to develop Rich Internet Applications (RIA).
- AngularJS is open source, completely free, and used by thousands of developers around the world. It is licensed under the Apache license version 2.0.
- AngularJS is a framework to build large scale, high performance, and easy-to-maintain web applications.
Angular has the following key features which makes it one of the powerful frameworks in the market.
- MVC – The framework is built on the famous concept of MVC (Model-View-Controller). This is a design pattern used in all modern day web applications. This pattern is based on splitting the business logic layer, the data layer, and presentation layer into separate sections. The division into different sections is done so that each one could be managed more easily.
- Data Model Binding – You don’t need to write special code to bind data to the HTML controls. This can be done by Angular by just adding a few snippets of code.
- Unit Testing ready – The designers at Google not only developed Angular but also developed a testing framework called “Karma” which helps in designing unit tests for AngularJS applications.
- Angular 2 is faster and easier than Angular 1.
- It supports the latest version of browsers and also supports old browsers including IE9+ and Android 4.1+.
- It is a cross-platform framework.
- Angular 2 is mainly focused on mobile apps.
- Code structure is more simplified than the previous version of Angular.
Angular 4 Features
Angular community has introduced some significant changes to Angular 4 and therefore, the major version number has been changed from 2 to 4 (skipping 3). The reason behind directly jumping to Angular 4 and skipping the version 3 was that the router package was in version 3.x, so instead of putting everything to 3.0 and the router to 4.0, the team chose to upgrade the versions of all the ng – modules to 4.0.
The following points introduced in Angular 4.0,
- TypeScript 2.1+ Required – TypeScript 2.1 and 2.2 have brought really nice features you should check out. Angular 4 now supports them (and you will soon be able to activate the new strictNullChecks TypeScript option for example).
- ModuleID Removed – They have added a new SystemJS plugin which dynamically converts “component-relative” paths in templateUrl and styleUrls to “absolute paths” for you.
- Ahead of Time Compilation – View Engine: As we know, in AoT mode, Angular compiles your templates during the build, and generates JS code whereas in case of Just in Time mode, this compilation is done at runtime. Now, AoT has several advantages, like we will get to know that our templates is incorrect at build time instead of having to wait at runtime, and the application starts faster (as the code generation is already done). The downside of AoT that people were facing was that the generated JS is generally bigger than the uncompiled HTML templates. So, in the vast majority of applications, the package is in fact bigger with AoT. The team worked quite hard to implement a new View Engine, that produces less code when you use the Ahead of Time compilation. The results are quite impressive on large apps, while still conserving the same performances.
- Animations – Angular Team have segregated animation package from @angular/core as a separate and dedication package. Therefore, if you don’t use animations, this extra code will not end up in your production bundles.
- Template is now ng-template – The template tag is now deprecated, which mean you should use the ng-template tag instead. It still works though. Now Angular has its own template tag called ng-template. You will have a warning if you use the deprecated template somewhere when you update to Angular 4, so it will be easy to spot them.