table of Contents

Single-chip architecture and micro-architecture services

Agile and DevOps

The driving force behind DevOps

Continuous Integration

Continuous Delivery

Continuous Deployment

CI automation using VSTS core ASP.NET application

prerequisites

Create a team project using VSTS

Create a new build definition for ASP.NET core applications

Create a new version definition

Introduction

Based Web applications to make our job easier. Especially when the interaction between the screen we need, we can consider single-page application ( SPA ). For SPA , we may need to web-pack or grunt or gulp like merging and bundling our client script. Click here to see the basics . Suppose we use ASP.NET Core , then we may need to use npm or bower or yarn , etc. to manage the package, so that we can recover the package and compile our application. However, if you are not automatically CI / CD . Then the first deployment of single-page application is also very difficult. In this article, my main focus is to show you how to use VSTS for your ASP.NET create build and release core applications.

Topics covered

Single-chip architecture and micro-architecture services
Agile and DevOps
Continuous Integration
Continuous Delivery
Continuous Deployment
Using VSTS create a project
Create a new build definition
With webpack bundled script
Create a new version definition

Let us understand the basic concepts

Single-chip architecture and micro-architecture services

At one time, single-chip architecture is a common practice, the waterfall model is very popular. In this method, everything is considered a major project, namely structural and sequential process. Now, it is broken down into small pieces and is iterative. Yes, I mean micro-service architecture and agile methodologies.

Agile and DevOps

We know that is an agile development methodology. DevOps The word is spreading quickly, it focuses on development to production support. We can say that this is a combination of software development and operations.

DevOps driving force behind

When we talk about DevOps term often occur when:

Continuous Integration ( CI )
Continuous Delivery ( CD )
Continuous deployment ( CD )

Continuous Integration

Several times in a day, developers check-in / submit and code into a shared repository ( Git , Team Foundation version control, etc.), and this code after the merger, it will automatically build and run automated tests.

Continuous Delivery

After the code integration, build and test code. Now it is ready to push your code to the staging environment (non-product testing) or production, but you need to manually push it to the approver.

Continuous Deployment

After the code integration, build and test code. Now there is no approval, it will be automatically pushed to the temporary environment (non-production test) or production.

Using VSTS the ASP.NET core automation applications CI

prerequisites

You need Visual Studio Team Services account and Git account . There's none? You can choose from https://www.visualstudio.com and https://github.com create a new free account.

Using VSTS create a team project

1, choose Project > New Project .

2, provide the project name and select the correct version control for the project Git or TFVC . Select the work item workflow. Click " create " button to create the project.

3, click Visual Studio clones .

4, VS IDE will pop up a window. Click the " Clone " button.

5. Select Team Explorer , and then click " Create a new project or solution " .

创建项目后，您需要提交所有更改。单击团队资源管理器>更改。填写更改注释，然后单击“全部提交”。

6、单击“同步”以同步代码。

7、最后，单击Publish（Outgoing Commits> Publish）。

为ASP.NET核心应用程序创建新的构建定义

1、选择Build＆Release选项卡和Builds。

2、选择“新建”以创建新定义。

3、选择Project，repository，branch，然后单击继续。

4、根据项目类型选择构建模板。我正在选择ASP.NET Core（.NET Framework）并单击Apply按钮以获取构建定义。

5、选择Process任务并填写构建定义的名称（例如HelloWorld-Dev，我们将在发行版中使用此名称）。选择Hosted VS2017作为要运行构建的默认代理。

如果您的团队使用Visual Studio 2017，则选择Hosted VS2017，然后它具有.NET Core框架并需要其他组件来构建项目。如果您的团队在Ubuntu上使用开发工具，请选择Hosted Linux。如果您的团队使用Visual Studio 2013或Visual Studio 2015，请选择Hosted。

为 “解决方案的路径或packages.config”选择项目解决方案文件，并填写工件名称。

6、选择获取源任务并检查正确的项目，存储库和分支。选择clean：true和clean选项：sources。标记来源：Nerver。报告：构建状态。

7、从阶段1中选择构建解决方案任务。选择Visual Studio版本：最新。MSBuild架构：选择适合您的X64或X86。

应用程序构建和捆绑Webpack

8、我们需要添加npm以安装我们项目中使用的所有包。要添加npm task，请单击阶段1右侧的（+）添加任务，然后选择包。查找并添加npm任务。现在拖放npm任务以在Build解决方案之前放置它。如果您使用Bower而不是npm，那么您需要添加Bower。

现在选择npm任务并选择Command : install. 现在，对于“使用package.json工作文件夹 ”，选择包含package.json文件的主项目的根文件夹。选择自定义注册表和身份验证注册表>要使用的注册表：我的.npmrc中的注册表; 高级>详细日志记录：已选中; 控制选项>已启用：已选中。

9、接下来，我们将需要PowerShell脚本任务来编译我们的客户端脚本。在这里，我们将使用web-pack安装webpack并编译JavaScripts。选择（+）添加任务，然后从Build部分查找PowerShell。将其添加到npm install和构建解决方案任务中间的构建定义。

填写以下信息：

显示名称：PowerShellScript
类型：内联脚本
内联脚本：

(Get-Item -Path ".\" -Verbose).FullName
$env:Path=[System.Environment]::GetEnvironmentVariable("Path","Machine")+";"+
[System.Environment]::GetEnvironmentVariable("Path","User")
Get-Command -CommandType Application -ErrorAction SilentlyContinue 
-Name webpack | Select-Object -ExpandProperty Definition | echo
npm install -g webpack --no-optional
node_modules\.bin\webpack -p