【翻译】在Mac上使用VSCode创建你的第一个Asp.Net Core应用

简介: Setting Up Your Development Environment 设置你的开发环境 To setup your development machine download and install .NET Core and Visual Studio Code with the C# extension. Node.js and npm is also required. If not already installed visit nodejs.org. 首先在你的机器上下载.Net Core和Visual Studio Code和相应的 C#扩展插件。

Setting Up Your Development Environment

设置你的开发环境

To setup your development machine download and install .NET Core and Visual Studio Code with the C# extension. Node.js and npm is also required. If not already installed visit nodejs.org.

首先在你的机器上下载.Net Core和Visual Studio Code和相应的 C#扩展插件。Node.js和npm也是必须的,如果你的机器上没有,可以从Nodejs.org下载安装。

Scaffolding Applications Using Yeoman

使用Yeoman搭建应用

We will be using [yo aspnet] to generate the Web Application Basic template, you may follow the full instructions in Building Projects with Yeoman to create an ASP.NET Core project which show an Empty Web for reference.

我们将使用[yo aspnet]去生成Web应用程序的基础模板,你也可以按照Building Projects with Yeoman的步骤创建一个空的Asp.Net Core Web应用程序。

Install the necessary yeoman generators and bower using npm.

使用npm安装必要的yeoman生成器和bower

npm install -g yo generator-aspnet bower

Run the ASP.NET Core generator

运行Asp.Net Core生成器

yo aspnet

 

  • Select Web Application Basic [without Membership and Authorization] and tap Enter

  • 选择Web Application Basic [without Membership and Authorization] 然后回车

  • Select Bootstrap (3.3.6) as the UI framework and tap Enter

  • UI framework下选择Bootstrap(3.3.6) 然后回车

  • Use "MyFirstApp" for the app name and tap Enter

  • 使用“MyFirstApp”作为引用的名称,然后回车

When the generator completes scaffolding the files, it will instruct you to restore, build, and run the application.

当生成完成所需的文件后,它会提示你接下来该恢复、构建和运行这个应用程序。

Your project is now created, you can use the following commands to get going
       cd "MyFirstApp"
       dotnet restore
       dotnet build (optional, build will also happen with it's run)
       dotnet run

Developing ASP.NET Core Applications on a Mac With Visual Studio Code

在Mac上使用Visual Studio Code开发Asp.Net Core应用程序

  • Start Visual Studio Code

  • 打开Visual Studio Code

  • Tap File > Open and navigate to your ASP.NET Core app

  • 点击 File > Open,导航到你的Asp.Net Core应用目录

File menu

When the application is opened, Visual Studio Code will prompt to restore the needed project dependencies as well as add build and debug dependencies.

当应用程序被打开时,Visual Studio Code会提示恢复所需的项目依赖项以及添加构建和调试所需的依赖项。

Info messages: 1. There are unresolved dependencies from project.json. Please execute the restore command to continue. 2. Required assets to build and debug are missing from your project. Add them?

Tap "Yes" to add the build and debug assets.

点击“Yes”添加所需构建和调试的部件。

In the VS Code Explorer sidebar, launch.json and tasks.json files are added to the .vscode folder.

Tap "Restore" to restore the project dependencies. Alternately, you can enter ⌘⇧P in Visual Studio Code and then type dot as shown:

点击“Restore”恢复项目所需依赖项。在开发中,你也可以在Visual Studio Code中按⌘⇧P进行恢复:

Command bar showing autocompletion option on typing 'dot' for 'dotnet: Restore Packages'

You can run commands directly from within Visual Studio Code, including dotnet restore and any tools referenced in the project.json file, as well as custom tasks defined in .vscode/tasks.json. Visual Studio Code also includes an integrated console where you can execute these commands without leaving the editor.

你可以直接在Visual Studio Code中运行包括恢复和使用 project.json中的项目引用,也可以在.vscode/tasks.json中自定义任务。Visual Studio Code还包括集成的控制台,你可以在不离开编辑器的情况下执行这些命令。

If this is your first time using Visual Studio Code (or just Code for short), note that it provides a very streamlined, fast, clean interface for quickly working with files, while still providing tooling to make writing code extremely productive.

如果这是你第一次使用Visual Studio代码(或刚用不久),你会发现它提供了一个非常精简,快速、干净的界面,快速处理文件,同时还提供了很多工具让编写代码非常富有成效。

In the left navigation bar, there are five icons, representing four viewlets:

在左边的导航栏中,有5个小图标,分别是:

  • Explore
  • Search
  • Git
  • Debug
  • Extensions

The Explorer viewlet allows you to quickly navigate within the folder system, as well as easily see the files you are currently working with. It displays a badge to indicate whether any files have unsaved changes, and new folders and files can easily be created (without having to open a separate dialog window). You can easily Save All from a menu option that appears on mouse over, as well.

这个浏览视图能够快速浏览你的文件目录,以及你现在正在处理的文件。它可以清晰得显示哪些文件没有保存,可以轻松得创建新文件夹和新文件(不需要打开一个新的对话框)。你也可以试用鼠标点击保存所有打开需要保存得文件。

The Search viewlet allows you to quickly search within the folder structure, searching filenames as well as contents.

这个搜索视图允许你在文件目录中快速得搜索文件名和文件内容。

Code will integrate with Git if it is installed on your system. You can easily initialize a new repository, make commits, and push changes from the Git viewlet.

VSCode已经集成了Git,你的系统如果已经安装好的话,可直接使用。你可以在Git视图里轻松的create repository,commits,和push。

 

GIT sidebar indicating 'This workspace isn't yet under git source control' with an 'Initialize git repository' button

The Debug viewlet supports interactive debugging of applications.

Debug视图支持与应用的交互式调试。

Code's editor has a ton of great features. You'll notice unused using statements are underlined and can be removed automatically by using ⌘ . when the lightbulb icon appears. Classes and methods also display how many references there are in the project to them. If you're coming from Visual Studio, Code includes many of the same keyboard shortcuts, such as ⌘KC to comment a block of code, and ⌘KU to uncomment.

VSCode编辑器界面也有很多非常棒的功能。当有黄色灯泡小图标时,你会发现没有在没有引用的声明下有下划线,可以使用⌘.自动修复。你的类和方法上会显示它们在项目中有多少次被引用。如果你曾经使用过Visual Studio,你会发现VSCode拥有很多相同的快捷键,比如⌘KC来注释代码,⌘KU来取消注释等等。

More on editor in Visual Studio Code.

更多功能查看Visual Studio Code

Running Locally Using Kestrel

使用Kestrel在本地运行

The sample is configured to use Kestrel for the web server. You can see it configured in the project.json file, where it is specified as a dependency.

示范已经使用Kestrel配置好Web Server了。你可以在project.json文件中看到它被配置成依赖项。

"Microsoft.AspNetCore.Server.Kestrel":

Using Visual Studio Code Debugger

使用Visual Studio Code调试

If you choose to have the debug and build assets added to the project:

如果需要调试的和构建的已经添加到项目中:

  • Tap the Debug icon in the View Bar on the left pane

  • 点击左侧面板中的Debug图标

  • Tap the "Play (F5)" icon to launch the app

  • 点击“Play(F5)”图片,运行应用。

DEBUG sidebar showing the triangle play button

Your default browser will automatically launch and navigate to http://localhost:5000

你的默认浏览器将自动运行并打开http://localhost:5000

Browser window

  • To stop the application, close the browser and hit the "Stop" icon on the debug bar
  • 关闭浏览器点击调试条上的“Stop”图标,可以停止应用。

VS Code Debug bar

Using the dotnet commands

使用dotnet命令

  • Run dotnet run command to launch the app from terminal/bash

  • 在terminal/bash中运行dotnet命令

  • Navigate to http://localhost:5000

  • 浏览器打开http://localhost:5000

  • To stop the web server enter ⌃+C.

  • ⌃+C停止web服务器

Publishing to Azure

发布到Azure

Once you've developed your application, you can easily use the Git integration built into Visual Studio Code to push updates to production, hosted on Microsoft Azure.

在你开发你的应用的时候,你能轻松的使用VSCode集成的Git更新到在Microsoft Azure上的生产环境。

Initialize Git

初始化Git

Initialize Git in the folder you're working in. Tap on the Git viewlet and click the Initialize Git repository button.

在你工作的文件中初始化Git。点击Git视图,再点击Initialize Git repository按钮。

GIT sidebar

Add a commit message and tap enter or tap the checkmark icon to commit the staged files.

添加一个提交信息,敲击回车或点击选择相应的小图标进行提交文件。

GIT sidebar showing file changes

Git is tracking changes, so if you make an update to a file, the Git viewlet will display the files that have changed since your last commit.

Git会跟踪更改,如果你更新了一个文件,Git视图会显示这个文件自最后一次提交后有更改。

Initialize Azure Website

初始化Azure Web站点

You can deploy to Azure Web Apps directly using Git.

你可以使用Git把应用程序部署到Azure。

Create a Web App in the Azure Portal to host your new application.

在Azure后台创建一个Web应用部署你的新应用程序。

Microsoft Azure Portal: New button: Web + Mobile selection in the Marketplace list reveals a Web App button under Featured Apps

Configure the Web App in Azure to support continuous deployment using Git.

在Azure上配置Web应用以使其支持Git。

Record the Git URL for the Web App from the Azure portal.

从Azure后台记录你的Git Url

Azure Portal for web application: Overview panel

In a Terminal window, add a remote named azure with the Git URL you noted previously.

在终端窗口中,添加一个名为azure提交到之前你记录的Git Url上。

git remote add azure https://shayneboyer@myfirstappmac.scm.azurewebsites.net:443/MyFirstAppMac.git

Push to master. git push azure master to deploy.

推送到master,git会推送到azure上相应的master。

Command window showing a successful deployment

Browse to the newly deployed web app.

打开浏览器浏览您的应用。

Browser window

Looking at the Deployment Details in the Azure Portal, you can see the logs and steps each time there is a commit to the branch.

在Azure后台你可以查看开发的详细信息,包括每次提交到分支的日志和步骤。

Azure Portal for web application: Deployment Details

原文链接

https://docs.microsoft.com/zh-cn/aspnet/core/tutorials/your-first-mac-aspnet

相关文章
|
29天前
|
存储 Shell Linux
快速上手基于 BaGet 的脚本自动化构建 .net 应用打包
本文介绍了如何使用脚本自动化构建 `.net` 应用的 `nuget` 包并推送到指定服务仓库。首先概述了 `BaGet`——一个开源、轻量级且高性能的 `NuGet` 服务器,支持多种存储后端及配置选项。接着详细描述了 `BaGet` 的安装、配置及使用方法,并提供了 `PowerShell` 和 `Bash` 脚本实例,用于自动化推送 `.nupkg` 文件。最后总结了 `BaGet` 的优势及其在实际部署中的便捷性。
60 10
|
6天前
|
开发框架 监控 前端开发
在 ASP.NET Core Web API 中使用操作筛选器统一处理通用操作
【9月更文挑战第27天】操作筛选器是ASP.NET Core MVC和Web API中的一种过滤器,可在操作方法执行前后运行代码,适用于日志记录、性能监控和验证等场景。通过实现`IActionFilter`接口的`OnActionExecuting`和`OnActionExecuted`方法,可以统一处理日志、验证及异常。创建并注册自定义筛选器类,能提升代码的可维护性和复用性。
|
6天前
|
开发框架 .NET 中间件
ASP.NET Core Web 开发浅谈
本文介绍ASP.NET Core,一个轻量级、开源的跨平台框架,专为构建高性能Web应用设计。通过简单步骤,你将学会创建首个Web应用。文章还深入探讨了路由配置、依赖注入及安全性配置等常见问题,并提供了实用示例代码以助于理解与避免错误,帮助开发者更好地掌握ASP.NET Core的核心概念。
18 3
|
18天前
|
数据采集 JSON API
.NET 3.5 中 HttpWebRequest 的核心用法及应用
【9月更文挑战第7天】在.NET 3.5环境下,HttpWebRequest 类是处理HTTP请求的一个核心组件,它封装了HTTP协议的细节,使得开发者可以方便地发送HTTP请求并接收响应。本文将详细介绍HttpWebRequest的核心用法及其实战应用。
53 6
|
28天前
|
开发框架 NoSQL .NET
利用分布式锁在ASP.NET Core中实现防抖
【9月更文挑战第5天】在 ASP.NET Core 中,可通过分布式锁实现防抖功能,仅处理连续相同请求中的首个请求,其余请求返回 204 No Content,直至锁释放。具体步骤包括:安装分布式锁库如 `StackExchange.Redis`;创建分布式锁服务接口及其实现;构建防抖中间件;并在 `Startup.cs` 中注册相关服务和中间件。这一机制有效避免了短时间内重复操作的问题。
|
2月前
|
前端开发 JavaScript 开发工具
跨域联姻:React.NET——.NET应用与React的完美融合,解锁前后端高效协作新姿势。
【8月更文挑战第28天】探索React.NET,这是将热门前端框架React与强大的.NET后端无缝集成的创新方案。React以其组件化和虚拟DOM技术著称,能构建高性能、可维护的用户界面;.NET则擅长企业级应用开发。React.NET作为桥梁,使.NET应用轻松采用React构建前端,并优化开发流程与性能。通过直接托管React组件,.NET应用简化了部署流程,同时支持服务器端渲染(SSR),提升首屏加载速度与SEO优化。
28 1
|
2月前
|
存储 缓存 安全
.NET 在金融行业的应用:高并发交易系统的构建与优化之路
【8月更文挑战第28天】在金融行业,交易系统需具备高并发处理、低延迟及高稳定性和安全性。利用.NET构建此类系统时,可采用异步编程提升并发能力,优化数据库访问以降低延迟,使用缓存减少数据库访问频率,借助分布式事务确保数据一致性,并加强安全性措施。通过综合优化,满足金融行业的严苛要求。
33 1
|
2月前
|
数据库 C# 开发者
WPF开发者必读:揭秘ADO.NET与Entity Framework数据库交互秘籍,轻松实现企业级应用!
【8月更文挑战第31天】在现代软件开发中,WPF 与数据库的交互对于构建企业级应用至关重要。本文介绍了如何利用 ADO.NET 和 Entity Framework 在 WPF 应用中访问和操作数据库。ADO.NET 是 .NET Framework 中用于访问各类数据库(如 SQL Server、MySQL 等)的类库;Entity Framework 则是一种 ORM 框架,支持面向对象的数据操作。文章通过示例展示了如何在 WPF 应用中集成这两种技术,提高开发效率。
41 0
|
2月前
|
开发者 API Windows
从怀旧到革新:看WinForms如何在保持向后兼容性的前提下,借助.NET新平台的力量实现自我进化与应用现代化,让经典桌面应用焕发第二春——我们的WinForms应用转型之路深度剖析
【8月更文挑战第31天】在Windows桌面应用开发中,Windows Forms(WinForms)依然是许多开发者的首选。尽管.NET Framework已演进至.NET 5 及更高版本,WinForms 仍作为核心组件保留,支持现有代码库的同时引入新特性。开发者可将项目迁移至.NET Core,享受性能提升和跨平台能力。迁移时需注意API变更,确保应用平稳过渡。通过自定义样式或第三方控件库,还可增强视觉效果。结合.NET新功能,WinForms 应用不仅能延续既有投资,还能焕发新生。 示例代码展示了如何在.NET Core中创建包含按钮和标签的基本窗口,实现简单的用户交互。
53 0
|
2月前
|
Java Spring 自然语言处理
Spring 框架里竟藏着神秘魔法?国际化与本地化的奇妙之旅等你来揭开谜底!
【8月更文挑战第31天】在软件开发中,国际化(I18N)与本地化(L10N)对于满足不同地区用户需求至关重要。Spring框架提供了强大支持,利用资源文件和`MessageSource`实现多语言文本管理。通过配置日期格式和货币符号,进一步完善本地化功能。合理应用这些特性,可显著提升应用的多地区适应性和用户体验。
32 0
下一篇
无影云桌面