前言

本教程將為您講解使用微軟的Visual Studio Express 2012或Visual Web Developer 2010 Express Service Pack 1 來(lái)建立一個(gè)ASP.NET MVC4 Web應(yīng)用程序所需要的基礎(chǔ)知識(shí)。建議您使用Visual Studio 2012，你將不再需要安裝任何組件，來(lái)完成此教程。如果您使用的是Visual Studio 2010，您必須安裝下面的組件。您可以通過點(diǎn)擊下面的鏈接，來(lái)安裝所需的所有組件：

• Visual Studio Web Developer Express SP1 prerequisites

• WPI installer for ASP.NET MVC 4

• LocalDB

• SSDT

如果您使用的是Visual Studio 2010而不是Visual Web Developer 2010，需要安裝WPI installer for ASP.NET MVC 4 和 Visual Studio 2010 prerequisites

本文的C#示例源代碼，是一個(gè) Visual Web Developer Project： 下載本文C＃示例源代碼。

本示例將構(gòu)建什么樣的應(yīng)用程序？

您將實(shí)現(xiàn)一個(gè)簡(jiǎn)單的電影列表應(yīng)用程序，此程序?qū)⒅С謩?chuàng)建、 編輯、 搜索和從數(shù)據(jù)庫(kù)中選取出電影列表的功能。下面是您將構(gòu)建的應(yīng)用程序的兩個(gè)截屏。它包括顯示選取自數(shù)據(jù)庫(kù)的電影列表頁(yè)面：

該應(yīng)用程序還允許您添加、編輯和刪除電影，以及顯示單個(gè)記錄的詳細(xì)信息。所有的用戶數(shù)據(jù)輸入場(chǎng)景都包含了數(shù)據(jù)驗(yàn)證邏輯，以確保存儲(chǔ)在數(shù)據(jù)庫(kù)中的數(shù)據(jù)都是正確的。

入門

運(yùn)行Visual Studio Express 2012或Visual Web Developer 2010 Express 來(lái)開始這個(gè)示例，在這個(gè)系列中大多都使用了Visual Studio Express 2012的屏幕截圖，同時(shí)你也可以使用Visual Studio 2010/SP1，Visual Studio 2012,Visual Studio Express 2012或Visual Web Developer 2010 Express來(lái)學(xué)習(xí)完成這個(gè)教程。從“開始” 頁(yè)面中，選擇“新建項(xiàng)目”。

Visual Studio是一個(gè)IDE集成開發(fā)環(huán)境。就像您使用Microsoft Word來(lái)編寫文檔，你可以使用集成開發(fā)環(huán)境（IDE）來(lái)創(chuàng)建一個(gè)應(yīng)用程序。在Visual Studio中的一個(gè)頂部工具欄中顯示了各種不同的選項(xiàng)來(lái)供您使用。在IDE中還有一個(gè)菜單，提供了另一種方式來(lái)執(zhí)行任務(wù)。（例如，您可以不從“開始”頁(yè)面中，選擇“新建項(xiàng)目”，您可以使用該菜單，然后選擇“ 文件“>“ 新建項(xiàng)目“）

創(chuàng)建您的第一個(gè)應(yīng)用程序

您可以使用 Visual Basic 或 C# 作為編程語(yǔ)言來(lái)創(chuàng)建您的應(yīng)用程序。請(qǐng)?jiān)谧髠?cè)選擇 Visual C#，然后選擇ASP.NET MVC 4 Web 應(yīng)用程序。命名您的工程為"MvcMovie"，然后單擊確定.

在新的 ASP.NET MVC 4 項(xiàng)目對(duì)話框中，選擇互聯(lián)網(wǎng)應(yīng)用程序。使用Razor作為默認(rèn)視圖引擎。

單擊確定。Visual Studio 剛剛創(chuàng)建的 ASP.NET MVC 項(xiàng)目使用了默認(rèn)的模板，所以在當(dāng)前的工程中您不需要做任何事情！這是一個(gè)簡(jiǎn)單的"Hello World ！"工程，并且這也是您開始“MvcMovie”工程的好地方。

從調(diào)試菜單中，選擇啟動(dòng)調(diào)試.

請(qǐng)注意您也可以使用鍵盤的快捷鍵F5來(lái)啟動(dòng)調(diào)試。

F5使Visual Studio啟動(dòng)IIS Express并運(yùn)行Web應(yīng)用程序。然后Visual Studio會(huì)啟動(dòng)瀏覽器并打開應(yīng)用程序的主頁(yè)面。請(qǐng)注意，在瀏覽器的地址欄中會(huì)顯示 localhost 而不是像example.com 這樣的地址。這是因?yàn)?localhost總是會(huì)被解析為您自己的本地計(jì)算機(jī)，在這種情況下，這正是您你剛剛建立的應(yīng)用程序。當(dāng)Visual Studio運(yùn)行一個(gè)Web工程時(shí)，會(huì)使用一個(gè)隨機(jī)端口的Web服務(wù)。在下面的圖片中，端口號(hào)是41788。當(dāng)您運(yùn)行該應(yīng)用程序時(shí)，您可能會(huì)看到一個(gè)不同的端口號(hào)。

在默認(rèn)模板頁(yè)面的右邊，為您提供了“主頁(yè)(Home)”, “關(guān)于(About)”和“聯(lián)系(Contact)”頁(yè)面。它還提供了注冊(cè)和登錄功能，并提供了Facebook和Twitter的鏈接。接下來(lái)的一步是修改此默認(rèn)應(yīng)用程序，并了解一些關(guān)于ASP.NET MVC的知識(shí)。關(guān)閉瀏覽器，讓我們修改一些源代碼吧。

譯者注：

本系列共9篇文章，翻譯自Asp.Net MVC4 官方教程，由于本系列文章言簡(jiǎn)意賅，篇幅適中，從一個(gè)示例開始講解，全文最終完成了一個(gè)管理影片的小系統(tǒng)，非常適合新手入門Asp.Net MVC4，并由此開始開發(fā)工作。9篇文章為：

1. Asp.Net MVC4 入門介紹

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/intro-to-aspnet-mvc-4

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1047018

2. 添加一個(gè)控制器

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-controller

· 譯文地址：

3. 添加一個(gè)視圖

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-view

· 譯文地址：

4. 添加一個(gè)模型

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-model

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1091907

5. 從控制器訪問數(shù)據(jù)模型

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/accessing-your-models-data-from-a-controller

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1114401

6. 驗(yàn)證編輯方法和編輯視圖

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/examining-the-edit-methods-and-edit-view

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1125390

7. 給電影表和模型添加新字段

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-new-field-to-the-movie-model-and-table

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1140334

8. 給數(shù)據(jù)模型添加校驗(yàn)器

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-validation-to-the-model

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1147449

9. 查詢?cè)敿?xì)信息和刪除記錄

· 原文地址：http://www./mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/examining-the-details-and-delete-methods

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1149311

10.第三方控件Studio for ASP.NET Wijmo MVC4 工具應(yīng)用

· 地址：http://powertoolsteam.blog.51cto.com/2369428/1196469