net5 react tutorial

使用 React 的 ASP.NET 5 SPA 教程和示例代码

概述

按照以下步骤创建默认模板代码。

• https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/react?view=aspnetcore-5.0&tabs=netcore-cli

您可以查看以下内容以获取更详细的说明。

• https://dev.to/packt/creating-spas-using-asp-net-core-and-react-59a0

文件夹结构如下

• my-new-app ClientApp 文件夹：这是 React 应用程序。将提供构建文件夹中的构建输出。
• my-new-app Controllers 文件夹：其中有一个虚拟 Web API，React 应用程序可以向其发送请求。
  • 要将任何数据从后端传递到前端，应该使用 Web API。如果在认证之前需要数据，那么可以创建一个无需认证的API路径来传递不需要保护的数据。
• my-new-app Pages 文件夹：其中包含一些标准 ASP.NET Razor 页面。
• my-new-app Program.cs：这是标准的 ASP.NET 文件。
• my-new-app Startup.cs：这指定它正在为 CilentApp build 文件夹中的 SPA 静态文件提供服务。这也设置了 Web API。
• my-new-app WeatherForcast.cs：这具有虚拟 Web API 使用的模型。

应用程序运行后，打开 https://localhost:5001 以查看该网站。

包含 GitHub 操作

• DOTNET 构建和测试
• 代码QL

有用的 Visual Studio Code 扩展

• https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp
• https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory

有用的 Visual Studio Code 参考

• https://docs.microsoft.com/en-us/dotnet/core/tutorials/with-visual-studio-code#debug
• https://docs.microsoft.com/en-us/dotnet/core/tools/
• https://stackoverflow.com/questions/34275209/xml-auto-commenting-c-sharp-in-visual-studio-code
• https://stackoverflow.com/questions/47995468/vscode-c-sharp-go-to-definition-f12-not-working
• https://www.strathweb.com/2019/04/roslyn-analyzers-in-code-fixes-in-omnisharp-and-vs-code/

有用的 .NET CLI 命令

• （为后端和前端创建默认模板） dotnet new React -o my-new-app
• (Powershell) SET ASPNETCORE_ENVIRONMENT=开发
• （在 my-new-app 文件夹中）dotnet build
• （在 my-new-app 文件夹中） dotnet run