Web Development using

Visual Studio 2012 & ASP.NET MVC

Adil Ahmed Mughal

Speaker => Adil Ahmed Mughal

Affiliations:

Contact Information:

@adilamughal

http://www.adilmughal.com

adil.mughal@live.com

What to Expect Today?

• What you must already know? – Object Oriented Programming Language such as Java,

C++, C# – 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

Agenda

• Web Fundamentals – HTTP Transactions

– Static & Dynamic Web Pages

– Role Web Server

• Beginning ASP.NET MVC – Overview of MVC

– Exploring MVC (File -> New Project)

– ASP.NET Intrinsic objects

– Demo Site

HTTP Transactions

• HTTP Request & Response

– The communication mechanism by which Web browsers talk to Web sites

– As a connection protocol, HTTP is built around several basic commands

– GET, HEAD, POST

– HTTP is Stateless Protocol

Web Browser (Client)

Web Site (Server)

HTTP GET

http://www.abc.com

HTML to be rendered

by browser Response

HTTP Transactions

• Sample GET Request

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

HTTP Transactions

• Sample Response

Static vs. Dynamic Pages

• Static Pages

– The earliest web sites were built primarily using static HTML pages.

– HTML eventually evolved to be capable of much more

• Dynamic Web Pages

– The user can make requests (often through a form) for data contained in a database on the server that will be assembled on the fly

• What's the difference?

– Static pages are those that send exactly the same response to every request

– Dynamic pages can customize the response on the server to offer personalization based on cookies and information it can get from the visitor.

Role of Web Server

• Role of Web Server

– A program on server that monitors port 80 for incoming HTTP Requests

– On the Microsoft platform, IIS is the watchdog intercepting HTTP requests from port 80—the normal inbound port for HTTP requests

Web Browser (Client)

Web Site (Server)

HTTP GET

http://www.abc.com

HTML to be rendered

by browser Response

IIS

(Web Server)

Beginning 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 three different development models: – Web Pages, MVC (Model View Controller), and Web

Forms.

Overview of MVC

Life Cycle of MVC Request

Browser URL Routing Controller Model View

POST

new

Invoke action Invoke method

Lookup view

Render (viewData)

HTML

Exploring ASP.NET MVC

• Demo: File -> New Project

DEMO

Web Development using

Visual Studio 2012 & ASP.NET MVC

Thank YOU for your time and attention!

Adil Ahmed Mughal