The document discusses web development using Visual Studio 2012 and ASP.NET MVC. It begins with an overview of what attendees should already know, such as object-oriented programming and basic web development. It then covers web fundamentals like HTTP transactions and static vs. dynamic pages. The document demonstrates building a sample application with ASP.NET MVC in Visual Studio 2012, explaining controllers, models, and views. It concludes with a question and answer section.

1. Web Development
using
Visual Studio 2012 & ASP.NET MVC
Adil Ahmed Mughal

2. Speaker => Adil Ahmed Mughal
Affiliations:
Contact Information:
adil.mughal@live.com
@adilamughal
http://www.adilmughal.com

3. What to Expect Today?
• What you must already know?
– Object Oriented Programming Language such as Java, C++, C#
– Previous hands on .NET and Visual Studio
– Basic familiarity with web development (HTML, CSS, JavaScript)
• What you will learn?
– Understanding of how web works under the hood
– A glance look at Model-View-Controller
– Demonstration of sample build using ASP.NET MVC & Visual Studio
2012

4. Agenda
1. Web Fundamentals
– HTTP Transactions
– Static & Dynamic Web Pages
– Role Web Server - IIS
2. Beginning ASP.NET MVC
– Overview of MVC
– MVC Request Lifecycle
– Exploring Model, View, Controller (File -> New Project)
– Demo sample

5. Web Fundamentals

6. HTTP Transactions
The browser generates a HTTP
Request e.g.
GET http://www.adilmughal.com
HTTP Request
HTTP Response
The server process the request and
sends the HTTP Response
containing HTML/JS/CSS for
browser to render

7. HTTP Transactions
HTTP Request
HTTP Response
HTTP Transactions = HTTP Request + HTTP Response

8. HTTP Request
• Commonly used HTTP Verbs
GET Retrieve
POST Update
PUT Create
DELETE Deletes a specified resource
GET http://www.adilmughal.com HTTP/1.1
Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, ... , */*
Accept-Language: en-us
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; ... .NET CLR
3.0.04506.30)
Host: localhost:80
Connection: Keep-Alive

9. HTTP Response
• Sample Response

10. Static vs. Dynamic Pages
Static Pages Dynamic Pages
• Unchanging Content • Dynamic content
• Pre-written HTML defines web • Utilizes server side languages
pages such as PHP, ASP.NET, JSP etc.
• Send exactly the same response • May generate different HTML
to every request for each request

11. Role of Web Server
• Role of Web Server
– A piece of software that run on a physical or virtual
machine, which designed to serve web content over
the internet
– Typically it monitors port 80 for incoming HTTP
Requests
– On the Microsoft platform, IIS is the watchdog
intercepting HTTP requests

12. Uniform Resource Locators
http://www.adilmughal.com/search?label=Visual%20Studio
URL Scheme Host Path Query String

13. Intro to ASP.NET MVC

14. Pre-Requisite
• Microsoft Web Platform Installer is one stop shop to get
complete ecosystem of web tools to get started
– Server, Frameworks, Database, Tools etc.
– Get the installer from http://www.microsoft.com/web/platform/
• Once you install Web Platform Installer, download the
following to get started
– Visual Studio 2012 Web Express (includes ASP.NET MVC 4)
– Windows Azure SDK (optional, required for deployment on Azure)

15. Pre-Requisite: Web Platform Installer

16. ASP.NET MVC
• Web application development framework by
Microsoft to easily create dynamic websites
• Built on top of CLR allowing programmer to write
ASP.NET code using any .NET Languages (such as
C#, VB.NET etc.)
• ASP.NET supports various development models:
– Web Pages, MVC (Model View Controller), and Web
Forms.

17. Overview of MVC

18. Life Cycle of MVC Request
Browser URL Routing Controller Model View
HTTP
Request
new
Invoke
Invoke action method
Lookup view
Render (viewData)
HTML

19. Controllers
• Routes & Controllers
• Action

20. Model
• Model Binding
• Validation

21. Views
• Razor Syntax
• Html Helpers
• Layout
• Partial Views

22. DEMO

23. Q&A

24. Web Development Adil Ahmed Mughal
using adil.mughal@live.com
Visual Studio 2012 & @adilamughal
ASP.NET MVC http://www.adilmughal.com
Thank YOU for your time and
attention!