ASP.NET网站教程从哪开始学？-网站相关-佑然科技平台

ASP.NET 网站开发全面教程

ASP.NET 是一个由微软开发的、用于构建 Web 应用程序的强大框架，它已经发展多年,目前主要有两条并行的技术路线：

（图片来源网络，侵删）

ASP.NET Core (推荐)：这是目前的主流和未来方向，它是完全重新设计的、跨平台（支持 Windows, macOS, Linux）、高性能、开源的框架。对于所有新项目，都应该选择 ASP.NET Core。
ASP.NET 4.x (传统/旧版)：这是之前的经典版本，主要用于维护旧的 .NET Framework 项目，它仅限于 Windows 平台。

本教程将主要围绕 ASP.NET Core 展开,因为它是行业标准和最佳选择。

第一部分：准备工作

在开始编写代码之前,你需要准备好开发环境。

安装必备软件

.NET SDK (Software Development Kit)：
- 作用：包含了编译和运行 .NET 应用程序所需的一切工具，包括编译器、运行时和命令行工具。
- 下载：访问 .NET 官方下载页面。
- 选择：根据你的操作系统下载最新的 LTS (长期支持) 版本，.NET 8.0 或 .NET 6.0，LTS 版本更稳定,适合生产环境。
代码编辑器：
（图片来源网络，侵删）
- Visual Studio Code (VS Code)：轻量级、免费、跨平台的代码编辑器，通过安装 C# 扩展，可以获得非常强大的 IntelliSense（智能提示）和调试功能。非常适合初学者和全栈开发者。
  - 安装 VS Code: https://code.visualstudio.com/
  - 安装 C# 扩展: 在 VS Code 的扩展市场中搜索并安装 "C# Dev Kit" 或 "OmniSharp"。
- Visual Studio (专业版/社区版)：功能最强大的集成开发环境，它提供了完整的项目模板、强大的调试器、图形化设计器和丰富的扩展。如果你习惯使用功能齐全的 IDE，这是最佳选择。
  - 下载 Visual Studio Community: https://visualstudio.microsoft.com/vs/community/
  - 安装时选择的工作负载：确保勾选 ".NET 桌面开发" 或 "ASP.NET 和 Web 开发"，这会自动安装必要的 SDK 和组件。

验证安装

打开终端（在 Windows 上是命令提示符或 PowerShell，在 macOS/Linux 上是 Terminal）,输入以下命令：

dotnet --version

如果显示了正确的版本号（0.100），说明 .NET SDK 安装成功。

第二部分：创建你的第一个 ASP.NET Core 网站

我们将使用最流行的项目模板 Razor Pages 来创建一个网站，Razor Pages 极其简单,非常适合初学者。

创建新项目

在终端中，导航到你想要存放项目的文件夹,然后运行以下命令：

（图片来源网络，侵删）

dotnet new webapp -o MyFirstWebApp

dotnet new webapp：创建一个新的 ASP.NET Core Web 应用程序项目，默认使用 Razor Pages 模板。
-o MyFirstWebApp：将项目创建在名为 MyFirstWebApp 的文件夹中。

运行项目

进入项目目录,然后运行：

cd MyFirstWebApp
dotnet run

终端会显示类似以下的信息：

info: Microsoft.Hosting.Lifetime[14]
      Now listening on: https://localhost:7123
info: Microsoft.Hosting.Lifetime[14]
      Now listening on: http://localhost:5123
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.

打开你的浏览器，访问 https://localhost:7123 (或 http://localhost:5123),你将看到一个漂亮的欢迎页面。

恭喜！你已经成功运行了第一个 ASP.NET Core 网站！

第三部分：核心概念解析

让我们来理解一下这个网站是如何工作的。

项目文件结构

打开 MyFirstWebApp 文件夹,你会看到以下关键文件：

MyFirstWebApp.csproj：项目文件，定义了项目的基本信息，比如使用的 .NET 版本、引用的 NuGet 包（第三方库）等。
Program.cs：应用程序的入口点，你配置了整个应用程序的服务（如数据库、日志）和请求处理管道（如中间件）。这是 ASP.NET Core 的“心脏”。
Properties/launchSettings.json：启动配置文件，定义了不同环境下的启动 URL、端口等信息。
wwwroot/：存放静态文件的目录，如 CSS、JavaScript、图片、字体等。
Pages/：存放 Razor Pages 的目录,这是你网站内容的主要地方。

Razor Pages 的工作原理

Razor Pages 是一种将 HTML 和 C# 代码结合在一起的技术。

页面模型：在 Pages/ 目录下，你会发现一个 Index.cshtml 文件和一个 Index.cshtml.cs 文件。
- Index.cshtml：这是视图文件，包含了 HTML 和 Razor 语法（以开头的 C# 代码）。
- Index.cshtml.cs：这是页面模型文件，是一个 C# 类，它包含了处理该页面请求的逻辑,例如从数据库获取数据。

渲染

打开 Pages/Index.cshtml,你会看到这样一行代码：

@* ... *@
<p>Learn about <a href="https://learn.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
@* ... *@

让我们修改它,显示一些动态内容。

打开 Pages/Index.cshtml.cs 文件。

在 IndexModel 类中,添加一个公共属性：

public string Message { get; set; } = "Hello from ASP.NET Core!";

打开 Pages/Index.cshtml 文件。

在 <h1> 标签下方,添加一行代码来显示这个消息：

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>@Model.Message</p>  <!-- 这里！ -->
    <p>Learn about <a href="https://learn.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

@Model 关键字用于访问页面模型 (IndexModel.cs) 中的属性和方法。

保存文件，如果你的项目正在运行，浏览器通常会自动刷新，如果没有，在终端按 Ctrl+C 停止，然后重新运行 dotnet run。

你应该在页面上看到了 "Hello from ASP.NET Core!" 这句话,这就是动态渲染的基本原理。

第四部分：构建一个简单的功能

让我们给网站添加一个简单的“计数器”功能,以了解如何处理用户交互。

在页面模型中添加逻辑：打开 Pages/Index.cshtml.cs，修改 IndexModel 类，添加一个计数器属性和一个处理“点击”事件的方法。

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace MyFirstWebApp.Pages
{
    public class IndexModel : PageModel
    {
        private readonly ILogger<IndexModel> _logger;
        public IndexModel(ILogger<IndexModel> logger)
        {
            _logger = logger;
        }
        // 添加一个计数器属性
        public int Count { get; private set; }
        // 添加一个处理 POST 请求的方法
        public void OnPostIncrement()
        {
            Count++;
        }
        public void OnGet()
        {
            // 初始加载时，可以从数据库或其他地方获取值
            Count = 0;
        }
    }
}

OnGet()：当用户第一次访问这个页面（通过 GET 请求）时调用。
OnPostIncrement()：当用户点击一个按钮，并且这个按钮触发了 POST 请求时调用，Razor Pages 会根据方法名自动匹配请求类型。

在视图中添加交互元素：打开 Pages/Index.cshtml，在 Message 下面添加一个按钮和一个显示计数的段落。
```
<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>@Model.Message</p>
    <p>Current Count: @Model.Count</p>
    
    <form method="post">
        <button type="submit" class="btn btn-primary" asp-page-handler="Increment">Click me</button>
    </form>
    <p>Learn about <a href="https://learn.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>
```
- <form method="post">：创建一个表单，method="post" 表示提交方式是 POST。
- <button type="submit">：一个提交按钮。
- asp-page-handler="Increment"：这是 Razor Pages 的一个特性，它会将 OnPostIncrement() 方法与这个按钮关联起来，当点击按钮时，浏览器会向服务器发送一个 POST 请求，OnPostIncrement() 方法就会被执行。
运行并测试：保存文件并刷新浏览器，你应该能看到 "Current Count: 0"，点击 "Click me" 按钮，页面的计数就会增加,这就是一个完整的服务器端交互流程！

第五部分：下一步学习路径

你已经掌握了 ASP.NET Core 的基础,接下来可以深入学习以下内容：

MVC (Model-View-Controller) 架构：

MVC 是另一种更传统的 Web 应用程序模式，适合构建大型、复杂的 API 和网站，理解 MVC 对于成为一名专业的 .NET 开发者非常重要，它与 Razor Pages 有很多共通之处,但组织方式不同。
Entity Framework Core (EF Core)：
- 作用：这是微软官方的对象关系映射器，它允许你使用 C# 对象来操作数据库，而无需编写复杂的 SQL 语句,这是开发数据驱动型应用的核心技术。
- ：数据库上下文、DbSet、数据迁移、CRUD 操作（创建、读取、更新、删除）。
身份验证与授权：
- 作用：管理用户登录、注册、角色权限等。
- ：使用内置的身份验证系统，配置注册、登录、登出功能,以及基于角色的访问控制。
Razor 语法进阶：
- 学习如何使用布局文件 (_Layout.cshtml) 来统一网站的页眉和页脚。
- 学习如何创建可重用的组件（称为 "Razor Components" 或 "View Components"）。
Web API 开发：

学习如何使用 ASP.NET Core 构建供前端（如 React, Vue, Angular）或移动端调用的 RESTful API。
部署：
- 将你开发的应用程序发布到服务器上,让其他人可以访问。
- ：使用 dotnet publish 命令，部署到 IIS (Windows)、Linux 服务器或使用云服务（如 Azure, AWS）。

第六部分：推荐学习资源

微软官方文档 (首选)：
- ASP.NET Core 官方文档：这是最权威、最全面的学习资料，内容更新及时,质量极高。
视频教程：
- YouTube - FreeCodeCamp：一个非常全面的 ASP.NET Core 入门系列。
- YouTube - Traversy Media：高质量的实战项目教程。
- [Bilibili - 郑子铭 (子铭哥哥)]：国内优秀的 .NET 讲师，有大量免费且高质量的 ASP.NET Core 教程。
在线课程平台：
- Udemy：搜索 "ASP.NET Core"，有很多高评价的课程，经常有折扣，Jonh Papa, Tim Corey 等讲师的课程非常受欢迎。
- Pluralsight：提供高质量的技能路径和课程。
社区与问答：
- Stack Overflow：遇到问题时,这里是寻找答案的最佳去处。
- GitHub：阅读优秀的开源项目源码是提升水平的绝佳方式。

学习 ASP.NET Core 是一个循序渐进的过程，从创建第一个 "Hello World" 项目开始，理解其核心概念，然后逐步构建更复杂的功能。多动手实践是掌握编程最快的方式。

祝你学习愉快！