Getting Started with AngularJS
- Why AngularJS?
- Understanding AngularJS
- An Overview of the AngularJS Life Cycle
- Separation of Responsibilities
- Integrating AngularJS with Existing JavaScript and jQuery
- Adding AngularJS to Your Environment
- Bootstrapping AngularJS in an HTML Document
- Using the Global APIs
- Creating a Basic AngularJS Application
- Using jQuery or jQuery Lite in AngularJS Applications
- Summary
This chapter is from the book
This chapter is from the book
This chapter is from the book
AngularJS is a JavaScript framework that provides a very structured method of creating websites and web applications. Essentially, AngularJS is a JavaScript library that is built on a lightweight version of jQuery—a combination that enables AngularJS to provide the best of JavaScript and jQuery and at the same time enforce a structured Model View Controller (MVC) framework.
AngularJS is a perfect client-side library for most web applications because it provides a very clean and structured approach. With a clean, structured front end, you will find that it is much easier to implement clean, well-structured server-side logic.
This chapter introduces you to AngularJS as well as the major components involved in an AngularJS application. Understanding these components is critical before you try to implement an AngularJS application because the framework is different from more traditional JavaScript web application programming.
After you have a good grasp of the components and the life cycle of an AngularJS application, you’ll learn how to construct a basic AngularJS application, step-by-step. This should prepare you to jump into the following chapters, which provide much more detail on implementing AngularJS.
Why AngularJS?
AngularJS is an MVC framework that that is built on top of JavaScript and a lightweight version of jQuery. MVC frameworks separate the business logic in code from the view and the model. Without this separation, JavaScript-based web applications can quickly get out of hand when you are trying to manage all three together and a complex maze of functions.
Everything that AngularJS provides, you could implement yourself by using JavaScript and jQuery, or you could even try using another MVC JavaScript framework. However, AngularJS has a lot of functionality, and the design of the AngularJS framework makes it easy to implement MVC in the correct manner. The following are some of the reasons to choose AngularJS:
- The AngularJS framework forces correct implementation of MVC and also makes it easy to implement MVC correctly.
- The declarative style of AngularJS HTML templates makes the intent of the HTML more intuitive and makes the HTML easier to maintain.
- The model portion of AngularJS is basic JavaScript objects, making it easy to manipulate, access, and implement.
- AngularJS uses a declarative approach to extend the functionality of HTML by having a direct link between the HTML declaratives and the JavaScript functionality behind them.
- AngularJS provides a very simple and flexible filter interface that enables you to easily format data as it passes from the model to the view.
- AngularJS applications tend to use a fraction of the code that traditional JavaScript applications use because you need to focus only on the logic and not all the little details, such as data binding.
- AngularJS requires a lot less Document Object Model (DOM) manipulation than traditional methods and guides you to put the manipulations in the correct locations in applications. It is easier to design applications based on presenting data than on DOM manipulation.
- AngularJS provides several built-in services and enables you to implement your own in a structured and reusable way. This makes your code more maintainable and easier to test.
- Due to the clean separation of responsibilities in the AngularJS framework, it is easy to test your applications and even develop them using a test-driven approach.