batman
batman

Reputation: 1

ASP.NET web api with angular project structure

First time asp.net webAPI + angular project. From many examples I've seen online I've found there are basically two ways for handling the views.

The first (which I have seen in many tutorials and courses) - use APIcontrollers only, so that the view are generated by angular. That means my project structure would have a folder 'app' and it will contain the html files (probably inside a 'view' folder). The routing will be done using angular routes. I will only have APIControllers in the project (without the regular Controller object). Example project: https://github.com/DanWahlin/CustomerManagerStandard

The second - using Controllers to generate the views, using Razor (cshtml files), and angular incorporated into those (i.e ng-click inside the cshtml). There's no special 'app' folder for angular etc. example project : https://github.com/Wintellect/Angular-MVC-Cookbook/tree/master/CRUDOperations

So, I'm wondering what are the pros and cons for each method, and when shall I use which one. Examples projects would be great as well.

I can only assume that the first method is more modular and differentiate server and client. However, using it means I'm loosing razor (Do I even need it?)

Thanks!

Upvotes: 0

Views: 1821

Answers (2)

Chris Story
Chris Story

Reputation: 1197

As a person who works at a Microsoft shop and loves AngularJS for nearly all my front-end, the sooner you get away from mixing Razor and AngularJS, the better, especially if you are going for a SPA.

The only time I would recommend using Razor at all would be to generate the landing page (and possibly login page/admin area). It does give a nice way to provide authentication to access the app and then use Web Api Authorization attributes to do the rest of the authentication.

Upvotes: 0

dbarnes
dbarnes

Reputation: 1833

I actually had to make this decision a few months back myself. This comes down to what you feel is more comfortable. I chose to do angular and WebAPI controls only. It makes me think in terms of true separation of concerns just easier, angular is your presentation layer and webapi is your services. This also gives you the freedom to do the compression/formatting of the actual html pages(instead of the cshtml pages which you really have no control over).

One more pro for WebAPI only is scalability, you would really only need one webserver for the webpages but you can scale out your WebAPI, this will allow you WebAPI to be your api as well as your clients as well.

Razor is just a view engine and in my experience angular does a good job of templating and directives to bear the cost of losing razor. You'll probably end up writing pure HTML in your razor files anyways once you get a hang of directives which means you'll have more of an issue adding a new view. Who wants to create a new controller, new action and a new view, and then have to do that in angular. It just ends up being easier and less complex to let server serve the html files, and let angular do all your routing and logic for you.

I believe too that the html files get cached too so you will see less round trips as you navigate page to page in angular.

Upvotes: 1

Related Questions