Single Page Application of MVC 5 Using AngularJS
4.1 (55 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
751 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Single Page Application of MVC 5 Using AngularJS to your Wishlist.

Add to Wishlist

Single Page Application of MVC 5 Using AngularJS

Satisfying business need of Combining MVC 5 Application With AngularJS in Single Page Application.
4.1 (55 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
751 students enrolled
Created by Maruti Makwana
Last updated 8/2015
Current price: $12 Original price: $20 Discount: 40% off
3 days left at this price!
30-Day Money-Back Guarantee
  • 1.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion

Training 5 or more people?

Get your team access to Udemy's top 2,000 courses anytime, anywhere.

Try Udemy for Business
What Will I Learn?
  • At the end of my course, students will be able to create Single Page Application [SPA] in ASP.Net MVC 5 using AngularJS Framework.
  • They will learn how to create SPA in Business Application scenario by combining MVC 5 [Server Side] with AngularJS [Client Side] to fulfill business needs. i have tried to cover this multi layered architecture in a easy to understand format.
View Curriculum
  • Downlaod and install visual studio 2013 express which is free available and also make sure that SQL server Express is also installed with it.

I want to teach intermediate angular JS to developers who have basic knowledge in application development and want to be able to use Angular javascript at client side effectively in business applications.

This course is having step by step code creation of Single Page Application[SPA] of Angular JS framework with ASP NET MVC 5 Business Application. Based on my Experience i learned that most of the time people get confused when they want to merge ASP Net MVC with AngularJS MVW architecture with SPA, or they do some mistakes without knowing proper way of doing this.

This course will surely solve this issue and make developers understand that how to implement this in real line of business application. In this course i am using number important features of MVC and Angular which are as follows.

  • Asp Net MVC architecture
  • Web API 2
  • AngularJS MVW Architecture
  • Dependency Injection of AngularJS
  • AngularJS Routing
  • AngulatJS Resource
  • Directives like ng-show, ng-pattern, ng-model, ng-repeat, ng-view, ng-disable, ng-click etc.
  • Services like $http, $scope, $resource, $routeProvider, $location, $error, $dirty, $invalid, etc
  • BootStrap CSS for responsive UI

The best thing of this course is we have combined multiple modules, controllers, services, factory of angularJS everything at one place in a small POC [proof of concept] kind of project so that after this developers can directly follow same for their projects. And things will be much clear when they do this with hands on step by step.

I make double sure that all the videos have proper steps and codes which should match with snippet and code source.

Who is the target audience?
  • Students who are having some basic knowledge of Asp.Net MVC and AngularJS can understand this course easily.
  • This Course is not for those who are very new to MVC or AngularJS for them i suggest they first go through my basic course of Learn AngularJS Step By Step
Compare to Other AngularJS MVC Courses
Curriculum For This Course
18 Lectures
Introduction of the Course
1 Lecture 05:27

In this lecture i am explaining the exact architecture of this course and how the server side parts and client side parts are going to be connected to each other. I believe that best way to learn any technology is to create project on that so in this series i have created a project which is having this architecture.

Preview 05:27
Dealing With ASP.Net MVC 5 Application
3 Lectures 18:05

In this lecture i have created MVC 5 Application using Visual Studio 2013 Update 4 and added a new Sql server Database with Simple Table.

Preview 06:22

In this lecture we will generate Ado.Net Entity Model for project based on Student Table which we have created.

Creating Ado.Net Entity Model based on Database Table

Using Scaffold templates provided by visual studio we have created Web API 2 controller with GET, PUT, POST, DELETE and we have registered Web API route in global.asax file so that we can use it.

Creating WebAPI 2 controller based on Model
Getting Started with AngularJS
3 Lectures 17:24

In this lecture we have added AngularJS library files in to our project so that we can use it further.

Adding Angular library files in project

In this lecture we are creating bundle of angular resource files and adding in to layout page, also we are creating some base JavaScript files [Empty] for our project module structure.

Setting up MVC project for the AngularJS

In this lecture we have created one main module StudentApp and in that we have injected another angular module with logical controller. Our controller is trying to get data using $http service of angularJS

Accessing data using $http service with DI of angular modules
Moving ahead towards Single Page Application
11 Lectures 57:02

In this lecture i have used angular-resource.js to use $resource service and injected that in main application module.

Adding $resource service on $http service to improve performance

In this lecture i have created new html page and connected it with index page of mvc also i have used angular ng-view directive

Preparing Page structure which should connect with main module

In this lecture i have injected ngRoute and using $routeProvider service i have configured angularJS routing pattern.

Adding Route using $routeProvider Service

In this lecture i have created multiple pages in templates folder and connected it to Angular Route of StudentApp Module.

Add multiple pages-controllers to the routing logic

  • In this i have created a new HTML page to add new student.
  • In this page i have used some angular services like $error, $dirty, $invalid for validations
  • also some angular directives like ng-click, ng-pattern, ng-model, ng-repeat, ng-show, ng-disable,
  • and above all we are using BootStrap classes to make this page UI good looking.
Creating Add new student page with Validations of $dirty and $error

  • In this lecture i have created AddStudent Controller of angular and submitted new student to the server side database.
  • Also i have done navigation using angular route with the help of $location service.
Creating Addstudent Controller and Page Navigation using $location service

In this lecture i have created page in which we have applied filter on all students collection and also we have done sorting. we have created this full page with responsive UI using BootStrap.

Get all Students and filter them

On all students collection we have applied DELETE functionality with the help of $http service

Apply Delete through $http

In this lecture i have explained how to use Service function on angular module to reuse code among different modules using dependency injection. also i have clarify when we should use which different function with angular module like Factory, Config, Service and Controller.

Understanding usage of services in angular JS

In this lecture i have explained all the module dependencies and how we have injected that.

Final Conclusion

please find attached code snippet

Code Snippets
About the Instructor
Maruti Makwana
4.4 Average rating
1,342 Reviews
22,258 Students
6 Courses
MCT-Corporate Trainer

I am providing trainings to different IT corporates from last 11+ Years on different Microsoft Technologies and some JavaScript Technologies.i am here to make my lectures online so that everyone can access my knowledge throughout the globe.

i know my strength that i can make complicated things simple and I will be happy if people like my videos and ask questions to me regarding technologies i know. My expertise is mostly on following technologies.

ASP NET MVC 5, Microsoft Azure, Sharepoint 2013, Windows Store Apps, Angular JS, Knockout JS, WebGL, Ember JS, Jquery,HTML 5, CSS3, WCF, WPF, etc