I am sure many of you reading this come from an ASP.NET background or are familiar with how ASP.NET web apps work with the constant post back to the server to update data, process it and redirect the user to the next step of the process. It has worked for the past 10 years and it has worked well. But, there are better ways to interact with the server and update the user.

The growth of JavaScript, jQuery and frameworks such as Backbone, Knockout, and Ember have done an enormous amount for improving client side interaction and asynchronous communications with the business logic back-end.

That is where the app I’m maintaining is, we use ASP.NET REST based services with jQuery to manage user interaction and communicate with the back end. It works and its performance is OK, but it’s not great and it really doesn’t take advantage of today’s browser capabilities.

As I started to research the latest frameworks appearing on the scene I realized, that more of our client side logic could be included in a Single Page Application giving an even better client experience. So, we slowly started migrating logic from the server-side ASP.NET pages to the client using Knockout and ASP.NET MVC into a quasi-Single Page Application.

We practiced the Model-View-Controller partitioning of concerns and we ended up with a faster, nicer and richer client side experience, but the more code I wrote, the more I noticed that I was repeating code and HTML all over the place. I was also adding additional code to take JSON objects and convert them into model objects the framework could bind to and manage.

Then one day as I explained our app to a new developer, I realized that two-thirds of our code was there to just interact with the framework. Only a third of the code had anything to do with our actual business logic. I knew there had to be a better way.

That’s when I came across a post on Google+ about AngularJS and I spent some time checking it out, it looked promising, and it had many of the features I was needing without having to bring in third party libraries from all over the place.

Right from the start the AngularJS examples show you how to bind your model data into your HTML content with very simple markup. There’s no need for special objects to handle the data binding for you and I was able to do away with all of the code to translate our data into objects the framework could interact with, AngularJS just used the data returned from our services without issue.

AngularJS also provides a way to extend your HTML markup through Directives and Filters. With Directives you can create your own HTML tags that binds to your data and outputs markup that automatically updates whenever the data changes.

Filters provide you a way to transform data into whatever subset of data or format you might need. The framework comes standard with filters for currency, data, lowercase, number plus several more to help order your data or break it into subsets based on an easy JSON based syntax.

The Route Provider in AngularJS provides routing and deep linking support important for Single Page Apps. You can define your routes, the templates to display and which controllers to load. Then by using the ng-view directive on your page, your templates will be loaded and displayed automatically without you having to write a single line of code.

AngularJS also includes a whole host of functionality for Form Validation. You can declare validation rules in your form’s mark up and then query the form in your controller to ensure your rules are met before continuing on with your logic. Using the data-binding you can dynamically display errors as they occur giving your end user feedback right when they need it.

All throughout the AngularJS Framework the concept of using services to handle cross cutting concerns is evident. There are services to handle exceptions, services to make asynchronous calls to your back-end services, services to interact with the DOM and mock services to help in testing.

As you build controllers or other services, AngularJS provides you with a built in dependency injection mechanism to get the services your code depends upon without a lot of coding and configuration. The dependency injection in AngularJS allows for extensibility, if you need to replace a service with your own service, all you need to do is declare it in your code and your service will be invoked instead of the framework version.

Finally AngularJS was built with testability in mind. AngularJS provides a full mock library to allow you to isolate your code for testing. There is even an entire portion of the framework devoted to end to end testing.

From my experience working with AngularJS over the past couple of months, I think the following words from the AngularJS site sums it all up.

`Write less code, go have beer sooner.`