Why was Angular introduced as a client-side framework?

Everything created was created to solve a problem. So why was Angular created in the first place? What problems was it created to solve?

Angular is a TypeScript-based open-source web application framework, developed and maintained by Google. It offers an easy and powerful way of building frontend web-based applications.

When Google released Gmail in 2004, it showed the world that web apps really could replace complex desktop applications. Google even open-sourced the Closure toolkit - a set of libraries and an optimized compiler that it used to build Gmail.

However, the problem was that Google's Closure tools weren't very developer-friendly. They relied heavily on Java, which alienated web developers at the time who were used to working with JavaScript, PHP, Ruby, and Python.

Therefore, VanillaJS (plain JavaScript without any type of additional library) and jQuery (a JavaScript library designed to simplify HTML DOM tree manipulation, event handling, CSS animation, and AJAX) were used by developers to develop dynamic single-page applications (SPA). As the website became more complex with added features and functionality, it was hard for the developers to maintain the code.

As a result, a few enterprising developers began to work on frameworks that would bring Gmail-like apps within reach of web developers.

In the beginning, there was SprouteCore, the first comprehensive JavaScript framework developed by Apple. It came with a complete set of widgets making it possible to build to build desktop-quality single-page web apps without even touching HTML or CSS. As good as it may sound, it wasn't that appealing to web developers as it made them feel as though their hard-won HTML and CSS skills weren't valuable. Other similar frameworks (GWT, Cappuccino, etc.) even avoided JavaScript by transpiling other languages into JS.

This left an opening for a framework that truly embraced the web. A couple of early frameworks (Backbone and Knockout) appeared and achieved a moderate amount of success. But none of these frameworks rocketed to popularity until Angular came along in 2010. Finally, we had an easy-to-use JavaScript framework that treated HTML as a first-class citizen.

Fun fact: Did you know where Angular got its name from? It was from the < > in HTML 🙂

Angular offers the following features:

• Out-of-the-box features: Several built-in features like routing, state management, rxjs library, and HTTP services are straight out of the box services provided by Angular.
• Two-way data binding: Built with Model-View-Controller (MVC) architecture, Angular synchronizes the Model (JavasScript variables) and the View (HTML). As the data in the Model changes, the View does too. Two-way data binding allows developers to reduce development time as they don't need to write additional code to provide continual View and Model synchronization. Prior to this, most developers had only seen this kind of data binding in desktop frameworks like WPF and Windows Forms.
• Directives: Directives allow developers to assign special behaviors to the DOM in order to create dynamic and rich content with HTML. Directives also provide an easy way to create reusable HTML + CSS components.
• Dependency Injection (DI): Dependency defines how different pieces of code interact with each other and how the changes in one component impact the other one. Usually, dependencies are directly defined in the components themselves. Therefore, every change in dependency requires changing components as well. With Angular, we can use Injector to define dependencies as external elements, which in turn decouples components from their dependencies. DI makes components more reusable and easier to manage and test. Need an HTTP client? No problem! Angular has a built-in service for that. Just ask for them, and Angular would inject it into your components. No need to instantiate anything yourself.

Angular is one of the most well-known solutions for SPA development besides React and Vue.js. It has been around for over 10 years and it has gone through countless adjustments since then. AngularJS was the first version of the framework which laid the foundation for today frontend application development.