ASP.NET Core MVC 使用者入門Get started with ASP.NET Core MVC

作者:Rick AndersonBy Rick Anderson

本教學課程可讓您了解 ASP.NET Core MVC web 開發與控制器和檢視。This tutorial teaches ASP.NET Core MVC web development with controllers and views. 若您不熟悉 ASP.NET Core Web 開發,請考慮此教學課程的 Razor Pages 版本,它提供較簡單的起點。If you're new to ASP.NET Core web development, consider the Razor Pages version of this tutorial, which provides an easier starting point.

本教學課程將教導您建置 ASP.NET Core MVC Web 應用程式的基本概念。This tutorial teaches the basics of building an ASP.NET Core MVC web app.

此應用程式會管理電影標題的資料庫。The app manages a database of movie titles. 您會了解如何:You learn how to:

  • 建立 Web 應用程式。Create a web app.
  • 新增並建構模型。Add and scaffold a model.
  • 使用資料庫。Work with a database.
  • 新增搜尋和驗證。Add search and validation.

結束時,您將會有一個可管理及顯示電影資料的應用程式。At the end, you have an app that can manage and display movie data.

檢視或下載範例程式碼 (如何下載)。View or download sample code (how to download).

必要條件Prerequisites

建立 Web 應用程式Create a web app

  • 從 Visual Studio 中,選取 [建立新專案]。From the Visual Studio select Create a new project.

  • 依序選取 [ASP.NET Core Web 應用程式] 和 [下一步]。Select ASP.NET Core Web Application and then select Next.

新增 ASP.NET Core Web 應用程式

  • 將專案命名為 MvcMovie,然後選取 [建立]。Name the project MvcMovie and select Create. 請務必將專案命名為 MvcMovie,以便在複製程式碼時,命名空間得以相符。It's important to name the project MvcMovie so when you copy code, the namespace will match.

    新增 ASP.NET Core Web 應用程式

  • 選取 [Web 應用程式 (Model-View-Controller)],然後選取 [建立]。Select Web Application(Model-View-Controller), and then select Create.

[新增專案] 對話方塊、左窗格中的 [.Net Core]、ASP.NET Core WebNew project dialog, .NET Core in left pane, ASP.NET Core web

Visual Studio 在您剛才建立的 MVC 專案中使用了預設範本。Visual Studio used the default template for the MVC project you just created. 您只要輸入專案名稱,然後選取幾個選項,就立刻會有工作中的應用程式。You have a working app right now by entering a project name and selecting a few options. 這是基本的入門專案。This is a basic starter project.

執行應用程式Run the app

選取 Ctrl-F5 以非偵錯模式執行應用程式。Select Ctrl-F5 to run the app in non-debug mode.

Visual Studio 會顯示下列對話方塊:Visual Studio displays the following dialog:

此專案設定為使用 SSL。

如果您信任 IIS Express SSL 憑證,請選取 [是] 。Select Yes if you trust the IIS Express SSL certificate.

此時會顯示下列對話方塊:The following dialog is displayed:

安全性警告對話方塊

若您同意信任開發憑證,請選取 [是] 。Select Yes if you agree to trust the development certificate.

如需詳細資訊,請參閱信任 ASP.NET Core HTTPS 開發憑證See Trust the ASP.NET Core HTTPS development certificate for more information.

  • Visual Studio 會啟動 IIS Express,並執行應用程式。Visual Studio starts IIS Express and runs the app. 請注意,位址列會顯示 localhost:port#,而不是類似於 example.com 的內容。Notice that the address bar shows localhost:port# and not something like example.com. 這是因為 localhost 是本機電腦的標準主機名稱。That's because localhost is the standard hostname for your local computer. 當 Visual Studio 建立 Web 專案時,會對網頁伺服器使用隨機連接埠。When Visual Studio creates a web project, a random port is used for the web server.

  • 使用 Ctrl + F5 (非偵錯模式) 啟動應用程式,可讓您變更程式碼、儲存檔案、重新整理瀏覽器,以及查看程式碼變更。Launching the app with Ctrl+F5 (non-debug mode) allows you to make code changes, save the file, refresh the browser, and see the code changes. 許多開發人員想要使用非偵錯模式,以便快速啟動應用程式並檢視變更。Many developers prefer to use non-debug mode to quickly launch the app and view changes.

  • 您可以從 [偵錯] 功能表項目的偵錯或非偵錯模式中啟動應用程式:You can launch the app in debug or non-debug mode from the Debug menu item:

    [偵錯] 功能表

  • 您可以選取 [IIS Express] 按鈕偵錯應用程式You can debug the app by selecting the IIS Express button

    IIS Express

    下圖顯示應用程式:The following image shows the app:

    Home 或 Index 頁面

在本教學課程的下一個部分中,您會了解 MVC,並開始撰寫一些程式碼。In the next part of this tutorial, you learn about MVC and start writing some code.

本教學課程可讓您了解 ASP.NET Core MVC web 開發與控制器和檢視。This tutorial teaches ASP.NET Core MVC web development with controllers and views. 若您不熟悉 ASP.NET Core Web 開發,請考慮此教學課程的 Razor Pages 版本,它提供較簡單的起點。If you're new to ASP.NET Core web development, consider the Razor Pages version of this tutorial, which provides an easier starting point.

本教學課程將教導您建置 ASP.NET Core MVC Web 應用程式的基本概念。This tutorial teaches the basics of building an ASP.NET Core MVC web app.

此應用程式會管理電影標題的資料庫。The app manages a database of movie titles. 您會了解如何:You learn how to:

  • 建立 Web 應用程式。Create a web app.
  • 新增並建構模型。Add and scaffold a model.
  • 使用資料庫。Work with a database.
  • 新增搜尋和驗證。Add search and validation.

結束時,您將會有一個可管理及顯示電影資料的應用程式。At the end, you have an app that can manage and display movie data.

檢視或下載範例程式碼 (如何下載)。View or download sample code (how to download).

必要條件Prerequisites

警告

如果您使用 Visual Studio 2017,請參閱 dotnet/sdk 問題 #3124 (英文),以取得未使用 Visual Studio 的 .NET Core SDK 版本相關資訊。If you use Visual Studio 2017, see dotnet/sdk issue #3124 for information about .NET Core SDK versions that don't work with Visual Studio.

建立 Web 應用程式Create a web app

  • 從 Visual Studio 中,選取 [建立新專案]。From the Visual Studio select Create a new project.

  • 依序選取 [ASP.NET Core Web 應用程式] 和 [下一步]。Selecct ASP.NET Core Web Application and then select Next.

新增 ASP.NET Core Web 應用程式

  • 將專案命名為 MvcMovie,然後選取 [建立]。Name the project MvcMovie and select Create. 請務必將專案命名為 MvcMovie,以便在複製程式碼時,命名空間得以相符。It's important to name the project MvcMovie so when you copy code, the namespace will match.

    新增 ASP.NET Core Web 應用程式

  • 選取 [Web 應用程式 (Model-View-Controller)],然後選取 [建立]。Select Web Application(Model-View-Controller), and then select Create.

[新增專案] 對話方塊、左窗格中的 [.Net Core]、ASP.NET Core WebNew project dialog, .NET Core in left pane, ASP.NET Core web

Visual Studio 在您剛才建立的 MVC 專案中使用了預設範本。Visual Studio used the default template for the MVC project you just created. 您只要輸入專案名稱,然後選取幾個選項,就立刻會有工作中的應用程式。You have a working app right now by entering a project name and selecting a few options. 這是基本的入門專案,讓我們從這裡開始吧。This is a basic starter project, and it's a good place to start.

執行應用程式Run the app

選取 Ctrl-F5 以非偵錯模式執行應用程式。Select Ctrl-F5 to run the app in non-debug mode.

Visual Studio 會顯示下列對話方塊:Visual Studio displays the following dialog:

此專案設定為使用 SSL。

如果您信任 IIS Express SSL 憑證,請選取 [是] 。Select Yes if you trust the IIS Express SSL certificate.

此時會顯示下列對話方塊:The following dialog is displayed:

安全性警告對話方塊

若您同意信任開發憑證,請選取 [是] 。Select Yes if you agree to trust the development certificate.

如需詳細資訊,請參閱信任 ASP.NET Core HTTPS 開發憑證See Trust the ASP.NET Core HTTPS development certificate for more information.

  • Visual Studio 會啟動 IIS Express,並執行應用程式。Visual Studio starts IIS Express and runs the app. 請注意,位址列會顯示 localhost:port#,而不是類似於 example.com 的內容。Notice that the address bar shows localhost:port# and not something like example.com. 這是因為 localhost 是本機電腦的標準主機名稱。That's because localhost is the standard hostname for your local computer. 當 Visual Studio 建立 Web 專案時,會對網頁伺服器使用隨機連接埠。When Visual Studio creates a web project, a random port is used for the web server.

  • 使用 Ctrl + F5 (非偵錯模式) 啟動應用程式,可讓您變更程式碼、儲存檔案、重新整理瀏覽器,以及查看程式碼變更。Launching the app with Ctrl+F5 (non-debug mode) allows you to make code changes, save the file, refresh the browser, and see the code changes. 許多開發人員想要使用非偵錯模式,以便快速啟動應用程式並檢視變更。Many developers prefer to use non-debug mode to quickly launch the app and view changes.

  • 您可以從 [偵錯] 功能表項目的偵錯或非偵錯模式中啟動應用程式:You can launch the app in debug or non-debug mode from the Debug menu item:

    [偵錯] 功能表

  • 您可以選取 [IIS Express] 按鈕偵錯應用程式You can debug the app by selecting the IIS Express button

    IIS Express

  • 選取 [接受] 同意追蹤。Select Accept to consent to tracking. 此應用程式不會追踪個人資訊。This app doesn't track personal information. 範本產生之程式碼所包含的資產有利於滿足一般資料保護規定 (GDPR)The template generated code includes assets to help meet General Data Protection Regulation (GDPR).

    Home 或 Index 頁面

    下圖顯示接受追蹤之後的應用程式:The following image shows the app after accepting tracking:

    Home 或 Index 頁面

在本教學課程的下一個部分中,您會了解 MVC,並開始撰寫一些程式碼。In the next part of this tutorial, you learn about MVC and start writing some code.