Introducing
ASP.NET MVC 5
- Day 1
By
I. Sekhar Srinivasan ( MCT )
Email Id :
sekharonline4u@gmail.com
Facebook :
http://facebook.com/sekharonline
YouTube :
http://youtube.com/sekharonline4u
Website:
www.sekhartheguru.net
Agenda
Introduction to ASP.NET MVC
Getting Started
Creating an Application in ASP.NET MVC
Working with Controllers in ASP.NET MVC
Understanding Razor View Engine
Understanding Bootstrap 3 usage in MVC
Why Should We Care About?
Build on ASP.NET
Scalable
Extensible
Testable
History of MVC
Introduced by TrygveReenskaug in 1979.
First used in SmallTalk 80.
MVC is also used by:
Java: Structs, Spring
PHP: Cake PHP
Python: Django
Ruby: Ruby on Rails
Perl: Catalyst
.NET: ASP.NET MVC
History of ASP.NET MVC Cont.
MVC Essentials
Models , Views
and Controllers
URL Routing
HTML Helpers
Model Binding
1.0
( 2009 )
Model Level
Validations using
Validation
Attributes
Lambda
Expressions in
HTML Helpers
2.0
( 2010 )
Razor Engine
View
Remote
Validations
Global Action
Filters
Dependency
Resolvers
Project Templates
3.0
( 2011 )
Attribute Based
Web API
Bundles and
Minification
Jquery Mobile
Integration
Open
Authentications
Routing
Async. Model
Web API 2
Bootstrap
Signal R
SPA
4.0
( 2012 )
5.0
( 2013 )
What MVC is Not?
Not the new Web Forms 4.0
Not a replacement for Web Forms, but Adds to it
It can not use Web Controls
Not a whole new engine but sits on ASP.NET engine
Not the best solution for REST
What is ASP.NET MVC ?
A new Web Application Project type
Simply an option
Not a replacement for WebForms
Builds on top ASP.NET
Manual vs Automatic Transmission
What ASP.NET MVC is?
Maintain Clean Separation of Concerns
Extensible and Pluggable
Enable clean URLs and HTML
Great integration within ASP.NET
Tooling Support
Tools to Use Setting Environment
VS.NET 2013: ASP.NET MVC 4 and ASP.NET MVC 5 are built-in
VS.NET 2012: ASP.NET MVC 3 and ASP.NET MVC 4 are built-in
VS.NET 2010 SP1: ASP.NET MVC 2 is built-in
To use MVC3:
Install "ASP.NETMVC3RTM
To use MVC4:
Install "ASP.NETMVC4forVisualStudio2010SP1"
New Features of ASP.NET MVC 5
ONE ASP.NET
Sites
Web Forms
Web Pages
Services
Single
Page
Apps
ASP.NET
MVC
Web API
Signal R
Introducing ASP.NET MVC
MVC is an Architectural Pattern which separates an application into 3 main components.
Model
View
Controller
ASP.NET MVC Flow
Controller
Request
Step 1
Incoming request directed to Controller
ASP.NET MVC Flow
Controller
Model
Step 2
Controller processes request and forms a data Model
ASP.NET MVC Flow
Controller
View
Step 3
Model is passed to View
ASP.NET MVC Flow
Controller
View
Step 4
View transforms Model into appropriate output format
ASP.NET MVC Flow
Controller
View
Step 5
Response is rendered
Response
Traditional Web Application Development
Requests
Slow
Slow
Slow
Slow
Thread Pool
Busy
Busy
Busy
Busy
Async. Programming in ASP.NET MVC 5
Requests
Slow
Thread Pool
To MVC or not To MVC, Thats the <?/>
MVC
Web Forms
You want full control over markup
You like programming against the reusable
control abstraction that encapsulate UI and logic
You want a framework that enforces separation
of concerns
You like using the WYSWIG designer and would
rather avoid angle brackets
TDD/Unit Testing is a priority for you
You like keeping logic on the server rather than
hand writing Javascript
Control abstractions get in your way more than
they help
Unit testing with the MVP pattern is sufficient
for your needs
You like writing Javascript
Understanding Controllers
It is a class which is used to accept the request from the user and
provide the response to the user.
Action
Results
Routing
Controllers
Action
Action
Filters
Action
Parameters
Controllers Actions
Actions are the ultimate request destination Public controller
methods
Non-static
No return value restrictions
Action Parameters
Actions can take a variety of parameters Primitive parameters (int,
bool, string)
Complex parameters
Model Binder looks for parameter values In route data
In form data
In query string
Results
Actions typically return an ActionResult
Action Selectors
ActionName
AcceptVerbs HttpPost, HttpGet
Action Filters
Custom Action Filters
Derive from ActionFilterAttribute base class
ASP.NET MVC Request Flow
Request
HTTP
Routing
Http
Handler
Route
Route
Handler
Controller
Response
View
Engine
View
Demos
Different Sizes !
Different Resolutions !
Devices supported by Bootstrap
Extremely Small
Devices
Phones(<768px)
col-xs-X
Small Devices
Tablets(768px)
Medium Devices
Desktops
(992px)
Large Devices
Desktops
(1200px)
col-sm-X
col-md-X
col-lg-X
What is Bootstrap 3 Grid System ?
1
10
11
Col-md-12
Col-md-6
Col-md-8
col-md-3
col-md-offset-3
Col-md-12col-md-offset-1
Col-md-6
col-md-3
col-md-offset-3
Col-md-8
Col-md-4
Col-md-6
Col-md-4
col-md-3
col-md-offset-1
12
Bootstrap Grid Mobile, Tablet and Desktop
Col-xs-X
Col-md-X
Col-sm-X
Col-md-8 col-sm-6 col-xs-12
10
11
12
Col-md-4 col-xs-6
Demos
Questions?
By
Sekhar Srinivasan ( MCT )
Email Id :
sekharonline4u@gmail.com
Facebook :
http://facebook.com/sekharonline
YouTube :
http://youtube.com/sekharonline4u
Website:
www.sekhartheguru.net