Each one has its own strengths and weaknesses, and specific areas of application, allowing you to choose based on the needs of a specific project. Also, many of the options are modular, allowing you to use only the components you need, or even mix components from different frameworks.

I'll consider in other article provide some good, practical examples of techniques that make the most out of the integration of these valuable frameworks.

But maybe some overview at first.

Why AngularJS?

AngularJS is one of the most powerful and adaptive JavaScript framework by the web developers and designers. It's flexible, it's adaptive, it's nimble and as if that weren't enough, in the past few years AngularJS has developed a vast and growing following among developers.

But, there are many frameworks out there that try to lead the complexities of web application development to varying degrees of success. Here it would be fine to state a difference between frameworks and libraries, the choice will influence your architecture. I mean libraries fit into your existing architecture adding specific functionality, however frameworks give you an architecture (file structure, etc.) that you have to follow.

So, what makes AngularJS different? Let me offer a few opinions.

The last year I’ve been working on a big project using AngularJS and I’ve become very impressed with the clarity it brings to developing enterprise-level web applications.

I’ve done a lot of development on both Windows and the Web. I’ve enjoyed writing desktop applications but writing web applications never seemed to fit into a similar simple but effective model. I think, the model that AngularJS defines feels familiar and comfortable.

Now let’s have a closer look at all those features.

• Modules

  They divide your web application into small, reusable and functional components which can be integrated with other web applications. Each module is identified by a unique name and can be dependent on other modules.

• Controllers

  They define the actual behavior of your app. It contains business logic for the view and connects the right models to the right views. A controller is associated with a HTML element with the ng-controller directive.

• Directives

  They are used to extend the HTML vocabulary i.e they decorate html elements with new behaviors and help to manipulate html elements attributes in interesting way. There are some built-in directives provided by angularjs like as ng-app, ng-controller, ng-repeat, ng-model etc.

• Templates

  They are just plain old HTML that contains Angular-specific elements and attributes. AngularJS used these templates to show information from the model and controller.

• Scope

  It’s an object that refers to the application model. It acts as a context for evaluating expressions. Typically, it acts as a connector between controller and view. Scopes are hierarchical in nature and follow the DOM structure of your angularjs app.

• Expressions

  They are JavaScript-like code snippets that are usually placed in bindings such as {{ expression }}. AngularJS expressions doesn't support control flow statements(conditionals, loops, or exceptions).

• DataBindings

  It’s the most useful feature which save you from writing a considerable amount of code. Now, developers are not responsible for manually manipulating the DOM elements and attributes to reflect model changes.

• Validations

  It enables you to develop a modern HTML5 form that is interactive and responsive. AngularJS provides you built-in validation directives to achieve form validation and they are based on the HTML5 form validators.

• Filters

  They are used to format data before displaying it to the user. They can be used in view templates, controllers, services and directives. There are some built-in filters provided by angularjs like as Currency, Date, Number, OrderBy, Lowercase, Uppercase etc.

• Services

  They are reusable singleton objects that are used to organize and share code across your app. They can be injected into controllers, filters, directives.

• Routing

  It helps you to divide your app into multiple views and bind different views to Controllers. The magic of Routing is taken care by an angularjs service $routeProvider, that provides method .when() and .otherwise() to define the routes for your app.

• Dependency Injection

  It’s a software design pattern that deals with how components get hold of their dependencies. AngularJS comes with a built-in dependency injection mechanism.

• Testing

  It’s designed to be testable so that you can test your AngularJS applications as easy as possible. It also comes with an end-to-end and unit test runner setup.

I’m not implying, of course, that AngularJS perfectly matches up to WPF programming, but the similarities are appealing. More importantly, the model that AngularJS provides should help developers to be more productive.

Why Bootstrap?

Although Angular already provides a large part of the functionality needed to build the frontend of our app, a good complement is to have an easily themeable CSS library. Nowadays there are several CSS front-end frameworks, but the number of really good ones can be counted on the fingers of one hand, being Bootstrap the most popular.

Bootstrap is the undisputed leader among the available frameworks today, given its huge popularity, which is still growing every day.

Although technically it’s not necessarily better than the others in the list, it offers many more resources (articles and tutorials, third-party plug-ins and extensions, theme builders, and so on) than the other frameworks combined. However, this popularity also has a small downside, sites that use default themes may end up looking very similar between them.

Bootstrap is 12 grid CSS framework, by grids I mean that logically divide the canvas area of the webpage into 12 columns. You can decide how much area an element can consume by assigning the number of columns to it. Using the grid systems helps in making the website responsive, which means anything you do using Bootstrap will be compatible with all screen sizes devices, because of this it is commonly called Mobile First CSS framework.

Undoubtedly one of the biggest advantages of using Bootstrap is the speed of development. The framework allows for rapid, responsive development that is consistent and well supported by the development and design community, and as the framework continues to develop, the reasons to use Bootstrap keep mounting.

In short, Bootstrap is everywhere. And this is the main reason people continue to choose it.

Why ASP.NET MVC?

ASP.NET MVC is a robust and mature platform for creating enterprise-level web applications, but there are of course other platforms out there that might be more appealing. Should one consider a Microsoft platform over another alternative?

I would summarize my answer to this as follows:

• The .NET runtime is a very mature, well understood framework that remains very popular.
• The ASP.NET MVC framework provides a good, easy-to-use abstraction over web protocols, including web APIs.
• The platform is highly extensible. Parts of the framework can be easily replaced as necessary in order to provide enhanced functionality.
• Microsoft has continued to strengthen the platforms that ASP.NET MVC builds upon in Windows Server and SQL Server.
• ASP.NET MVC provides a good testing story.

The purpose is not to be a salesman for Microsoft technologies, but I think that ASP.NET MVC is a strong platform for building enterprise web applications.

Why AngularJS, Bootstrap and ASP.NET MVC?

As we all know, web development has moved forward. Whereas before we might create beautiful Flash or Silverlight applications to enhance the user’s web experience, those days are unfortunately gone. With the preponderance of devices using the web, we can’t depend on plug-ins to drive our applications.

Web standards have also moved forward. HTML5 and CSS3 are now the new goal posts for building an enhanced web experience. SPA (single-page applications) are the new normal, form-intensive enterprise class applications are ideally suited for being built on this standard.

The main idea compared to other more traditional server-side architectures is to build the server as a set of stateless reusable REST services, and from an MVC perspective to take the controller out of the backend and move it into the browser:

RESTful actions are quickly becoming the standard for communicating from the server to the client. In one line of JavaScript, you can quickly talk to the server and get the data you need to interact with your web pages.

The client is MVC-capable and contains all the presentation logic which is separated in a view layer, a controller layer and a frontend services layer. After the initial application startup, only JSON data goes over the wire between client and server.

Therefore the robustness of the ASP.NET MVC platform needs an equally robust client framework and I am convinced that AngularJS and Bootstrap are and will be great partners.