Book Image

AngularJS by Example

By : Chandermani
Book Image

AngularJS by Example

By: Chandermani

Overview of this book

<p>AngularJS makes web JavaScript web development less painful and more organized – it’s unsurprising that today it’s one of the most popular tools in web development.</p> <p>AngularJS by Example helps you get started with this essential web development framework quickly and easily, guiding you through AngularJS by showing you how to create your own real-world applications. By adopting this approach, you can bridge the gap between learning and doing immediately, as you follow the examples to learn the impressive features of Angular and experience a radically simple–and powerful–approach to web development.</p> <p>You’ll begin by creating a simple Guess the Number game, which will help you get to grips with the core components of Angular, including its MVC architecture, and learn how each part interacts with one another. This will give you a solid foundation of knowledge from which you can begin to build more complex applications, such as a 7 minute workout app and an extended personal trainer app. By creating these applications yourself, you will find out how AngularJS manages client-server interactions and how to effectively utilize directives to develop applications further. You’ll also find information on testing your app with tools such as Jasmine, as well as tips and tricks for some of the most common challenges of developing with AngularJS.</p> <p>AngularJS by Example is a unique web development book that will help you get to grips with AngularJS and explore a powerful solution for developing single page applications.</p>
Table of Contents (15 chapters)
AngularJS by Example
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

The basics of Model View Controller


MVC is a UI architectural pattern that has been around for some time. It is based on the premise of separation of responsibility. In MVC, we have the following components:

  • Model: This stores business data

  • View: This represents the model in UI

  • Controller: This is responsible for coordinating between a model and view

Any change in the model is reflected in the view and any change done by the user while interacting with the view is reflected back on the model. Here, the controller acts as a coordinator and is responsible for keeping the model and view in sync.

This is an over-simplified definition of the MVC and if we search the Web, we will find numerous variations of this pattern such as MVP, Front Controller, MVVM, and maybe some others. The net effect of this separation is that the code becomes more organized, more understandable, and maintainable.

For us, the best way to understand MVC is to see it in action and hence, we are going to build our first Hello World app in AngularJS. This app will help us to become familiar with the AngularJS framework and see the MVC paradigm in action.