Understanding AngularJS and its Uses

Understanding AngularJS and its Uses

In this session, you will be able to:

Describe what AngularJS is

Explain why we choose AngularJS

Analyze MVC architecture concepts

Describe where AngularJS is used

AngularJS – An Introduction

What is AngularJS?

• AngularJS is a JavaScript framework that is used to build a browser based Web applications
• It is useful in building single-page Web applications to load varying content dynamically based on user actions
  
• It is written in JavaScript with a reduced jQuery library called jQuery lite
• Misko Hevery and Adam Abrons are the two developers who developed AngularJS
• It was first released in October 2010. The latest version, as of now, is Angular 2.4.3 in AngularJS

• It enables the developer, to encapsulate a portion of a page as one application
• The objective of AngularJS is to provide a framework that makes it easy to implement well-designed and well-structured Web pages and applications
• AngularJS makes Web application and the code very simple to write, test, and maintain

Why do we Choose AngularJS?

Some of the reasons:

• It makes us implement MVC and makes it easy to correctly implement MVC
• The model components of AngularJS are basic JavaScript objects
• It allows us to have our custom defined tags in HTML
• It provides simple and flexible filters that help us to easily format data
• AngularJS applications use less code than traditional JavaScript applications
• AngularJS applications need less Document Object Model (DOM) manipulation
• It supplies several built-in services and helps us to implement our own services
• It is easy to test applications and develop them using a test-driven approach

MVC Concepts

MVC Architecture Pattern

• AngularJS supports MVC architecture in software development.
• The Model holds the data and logic, the View holds the visual layout and presentation, while the Controller coordinates the Model and View.

MVC Architecture Benefits in AngularJS

• MVC-style architecture offers us a huge reduction in the effort required for the overall app development cycle
• Through MVC, we apply the principle of ‘Separation of Concerns’
• MVC helps in the testing phase also. It leads to applications that are much easier to test unit wise and the total application as a whole
• MVC is a tried and tested way to build robust applications
  

Code For A Simple Angular JS Application

Working of a Simple AngularJS Application

Summary

• AngularJS is a JavaScript framework which we use to build Web applications and dynamic Websites.
• MVC is a software design pattern that we follow while we develop our applications.
• AngularJS helps us to implement well-designed and well-structured Web applications using a Model-View-Controller (MVC), Model-View-Viewmodel (MVVM), and Model-ViewWhatever (MVW) framework.
• The model has application data.
• The view is what is visible to the users of our application
• The controller acts as the link between the model and the view.
• The view is defined in HTML, while the model and controllers are implemented in JavaScript.
• Important components of an AngularJS application are directives, expressions, and filters.
• AngularJS has attained widespread acceptance and many popular Websites and Web applications are based on it.