Basic Angular Introduction for Starter: What It is and Why You Should Use Angular

complete basic angular introduction on majimetech

In this article, I’m going to give you a basic angular introduction overview of a very popular and widely used client-side framework called Angular. In this basic Angular introduction, mostly aimed at beginner level developers who have little experience with JS frameworks and want to learn the basic idea behind Angular as well as understand its differences from AngularJS.

A JavaScript framework is a sort of buzzword now a day: Everyone keeps discussing these frameworks, and many web developers are arguing about the best solution.

So, let’s move toward Angular introduction, shall we?

Why Do I Need a Framework?

If you’re not familiar what a JavaScript (or client-side) framework is, that’s a technology give us the right tools to build a web application while also defining how it should be designed and how the code should be work.

Now a day most JS frameworks are opinionated, meaning they have their own philosophy of how the web application should be built and you may need to spend some time to learn the core concepts behind JS. Other solutions, like Backbone, do not guide developers on how they should craft the project, thus some people even call such technologies simply libraries, rather than frameworks.

Actually, JavaScript frameworks do not emerge that long ago. I remember those times where websites were built with poorly structured JavaScript code (in many cases, powered by jQuery). However, client-side User Interface has become more and more complex, and JavaScript lost its reputation as a “toy” language. Modern websites rely totally on JS and the need to properly organize (and test!) the code has arisen. Therefore, client-side frameworks have become famous and nowadays there are at least a dozen of them.

Basic Angular Introduction: What Angular Actually Is

AngularJS used to be the “golden child” among JS frameworks, as it was initially introduced by Google Corporation in 2012. It was built by the author with the Model-View-Controller concept in mind.

The framework, totally based on pure JavaScript, was intended to decouple an application’s logic from DOM manipulation, and aimed at dynamic page updates. Still, it wasn’t very intrusive: you could have only a part of the page controlled by AngularJS. This framework provides many powerful features allowing the Web developer to create rich, single-page applications quite easily.

Specifically, an interesting concept of data binding was introduced that meant automatic updates of the view whenever the model (data) changed, and vice versa. On top of that, the idea of directives was presented, which allowed converting your own HTML tags, brought to life by JavaScript. For example, you may write:

<calendar> </calendar>

This is a custom tag that will be processed by Angular JavaScript and turned to a full-fledged calendar as instructed by the underlying code. (Of course, your job would be to code the appropriate directive.)

Another quite important thing was Dependency Injection, which allowed application components to be wired together in a way that facilitated reusable and testable code. Of course, there’s much more to AngularJS, but we’re not going to discuss it thoroughly in this article.

AngularJS became popular very quickly and received a lot of focus from developers. Still, its creator decided to take another step further and proceeded to develop a new version which was initially named Angular 2 (later, simply Angular without the “JS” part). It’s no coincidence the framework received a new name: actually, it was fully re-written and redesigned, while many concepts were reconsidered.

The first stable release of Angular 2 was published in 2016, and since then AngularJS started to lose its popularity in favor of a new version. One of the main features of Angular 2 was the ability to develop for multiple platforms: web, mobile, and native desktop (whereas AngularJS has no mobile support out of the box).

Then, to make things even more complex, by the end of 2016, Angular 4 was released. “So, where is version 3?”, you might wonder. I was asking the same question, as it appears that version 3 was never published at all! How could this happen? Angular Team decided to stick with the semantic versioning since Angular 2.

Following this principle, changing the major version (for example, “2.x.x” becomes “3.x.x”) means that some breaking changes were introduced. The problem is that the Angular Router component was already on version 3. Therefore, to fix this misalignment angular team was decided to skip Angular 3 altogether. Luckily, the transition from Angular 2 to 4 was less painful than from AngularJS to Angular 2, though many developers were still quite confused about all this mess.

Angular 5 was released in November 2017. It is also backward compatible with prior Angular versions. Angular 6 was then released in May 2018, In this major release focused less on the underlying framework, and more on the toolchain and on making it easier to move quickly with Angular in the future. Angular 7 was released in October 2018. This release contains new features for our toolchain and has enabled several major partner launches.

Reference:  Ilya Bodrov-Krukowski, Angular Introduction: What It Is, and Why You Should Use It

Leave a Reply

Your email address will not be published. Required fields are marked *