Glimpse of Single Page App using ASP.NET MVC 5 and Angular

Hi Friends,

It’s been long since i blogged any thing but it’s ok as i was working on one of the assignments which i shared few days back where in i’ll be wiring up bunch of technologies to make a robust SPA. Here, is the glimpse of the app what i have been working on.

Looks like my git shell has been corrupted, hence not able to push images in git. not a problem, will fix the same some time later, but for now let me upload images here itself.

However, below is the solution structure for the same. However, this is still incomplete as i have not yet added the testing project. But that’s ok, will be adding shortly and publishing the same shortly…Now, below is the glimpse of variety of technologies used so far to make this app…

Technologies Used

Client Side Technologies

Server Side Technologies

so, the one showed below is the web project rather web api project talking to and fro with my other projects listed here. Here, the crucial things are api controllers and my client side scripts “Angular” here for delivering the same back to UI. Other projects are equally important where in one is having models project which is keeping my plain classes then contracts project which is the medium for Unit of Work Pattern and Repository Pattern. Then the last one is Data project where Entity Framework is playing it’s role. Here, I have also used design principles like Single Repository principle to keep the things simple and clean and Factory Pattern to create the required instance in case if that is not created earlier by the app. Like this there are variety of out of the box things i used in this app which you will experience once you start building this app right from the blank state.

1st

2nd

3rd

4th

5th

6th

7th

8th

9th

10th

11th

Below, is the glimpse of all api controller sets and the same in action as well.




12th

13th

14th

Now, at the end my two driving factors of my app; my two Angular files.

Here, i also used qunit.js to test my api controller. Below is the glimpse of api test resources and their test results.

15th

16th

17th

and below is the snippet used for the same.


Beta Version Download Link:- https://github.com/rahulsahay19/MovieReview-Angular/tree/Movie-Review-Angular

I hope you liked the glimpse, stay tuned for complete step by step tutorial. Till then stay tuned and Happy Coding.

Thanks,
Rahul

5 thoughts on “Glimpse of Single Page App using ASP.NET MVC 5 and Angular

Comments are closed.