# Friday, 06 October 2017

The following articles walk the user through creating an ASP.NET application; storing source control history in a Visual Studio Team Services project Git repository; and automatically deploying to an Azure web app whenever code changes are pushed to the repository.

Creating a Team Project in Azure

Creating an ASP.NET Web Project and Storing code in a VSTS Git Repository

Configuring Automatic Deployment from VSTS to an Azure Web App

ALM | Visual Studio | VSTS | Web
Friday, 06 October 2017 10:23:00 (GMT Daylight Time, UTC+01:00)
# Thursday, 05 October 2017

This is Part 3 in a series of articles about integrating VSTS, Azure Web Apps, ASP.NET applications, and Visual Studio.

In previous articles, I showed you how to create a VSTS Team Account and Team Project linked to Azure  and how to create an ASP.NET Web application and link this to your VSTS team project in order to store the project code in the Team Version Control Repository.

In this article, I will show you how to automatically deploy code from your VSTS Team Project repository to an Azure Web App every time you push code changes to that repository.

This configuration is done in the Azure portal.

Log into your Azure account and navigate to the portal by clicking the PORTAL link at the top right, as shown in Fig. 1.

VSTSp3-01-AzurePortalLink
Fig. 1

From the Azure portal, select

New | Web + Mobile | Web App

as shown in Fig. 2.

VSTSp3-02-NewWebApp
Fig. 2

The Create Web App blade displays, as shown in Fig. 3.

VSTSp3-03-CreateWebAppBlade
Fig. 3

At the App Name field, enter a name for your app. This must be unique among Azure App Services. Although you can assign a custom domain to this later, the default URL will be

http://xxxx.azurewebsites.net

where xxxx is the name you assigned to this Web App.

If you navigate to this URL (or click the hyperlink in the Overview tab), you will see a default Azure We App page.

At the Resource Group field, select "Create New" and enter a name for your resource group.

At the "OS" field, select the operating system on which you want to deploy your Web App.

Click the [Create] button to create your Web App. This usually takes less than a minute. A message displays when the App is created with a [Go to Resource] button to quickly open your Web App. (Note: You can also find your Web App by selecting "All Resources" in the left sidebar.)

The Web App Management blade displays, as shown in Fig. 4.

VSTSp3-04-WebAppManagment
Fig. 4

Select "Deployment Option" on the left menu of this blade to display the Deployment Option blade, as shown in Fig. 5.

VSTSp3-05-DeploymentOption
Fig. 5

Click "Choose Source" to display a list of Source repository types, as shown in Fig. 6.

VSTSp3-06-ChooseSource
Fig. 6

Select "Visual Studio Team Services".

You will return to the "Deployment Option" blade, but options specific to VSTS will now display, as shown in Fig. 7.

VSTSp3-07-DeploymentOptionVSTS
Fig. 7

Select your VSTS Account and Project from the dropdown. (Note: Your account and project will only appear if you have linked your VSTS project to Azure, as described here.)

Click the [OK] button to configure this automation.

It should take less than a minute to complete.

Any code currently in the project's repository will be deployed to Azure. You can see this by once again navigating to the Web App's URL (http://xxxx.azurewebsites.net).

Future code code pushed to the Team repository will also be deployed automatically to Azure.

In this article, you learned how to set up automatic deployment to an Azure Web App each time code is pushed to a VSTS project code repository.

ALM | Visual Studio | VSTS | Web
Thursday, 05 October 2017 10:48:00 (GMT Daylight Time, UTC+01:00)
# Wednesday, 04 October 2017

This is Part 2 in a series of articles about integrating VSTS, Azure Web Apps, ASP.NET applications, and Visual Studio.

In my last post, I showed you how to create a new Team Account and Team project linked to Azure.

In this article, I will show how to open this new project in Visual Studio, start working with it, and check your code into VSTS Git repository.

To view your account and project in VSTS, open a new browser tab and navigate to https://xxxx.visualstudio.com/_admin

where xxxx is the name of the account you just created. You can see my account displayed in Fig. 1.

VSTSp2-01VisualStudioDotCom
Fig. 1

Click on the name of your project to display details about it, as shown in Fig. 2.

VSTSp2-02VstsProject
Fig. 2

Click the Code link at the top menu. If you have already checked in code, you will see that code in your Version Control Repository. New projects will look like my project, shown in Fig. 3.

VSTSp2-03VstsCode
Fig. 3

Click the [Clone in Visual Studio button]. This launch Visual Studio (You will probably be prompted to switch apps)

In Visual Studio, you should see the Team Explorer, as shown in Fig. 4. If you don't see it, you can find it by selecting View | Team Explorer from the menu.

VSTSp2-04VisualStudioTeamExplorer
Fig. 4

Click "Clone this repository" to display the Clone Repository dialog, as shown in Fig. 5.

VSTSp2-05VisualStudioTeamExplorerClone
Fig. 5

You have the opportunity to change where this new local repository will be saved on your hard drive. Whether you change it or not, you should note the location.

Click the [Clone] button. This will initialize a local GIT repository that points to your VSTS Team project.

You can now create a new Web App project in Visual Studio.

Select File | New | Project from the menu.     The "New Project" dialog displays, as shown in Fig. 6.

VSTSp2-06VisualStudioNewProject
Fig. 6

Under the "Templates" tree on the left, expand Visual C#; then select "Web". Select "ASP.NET Web Application" or "ASP.NET Core Web Application" as your template.

The location of your project is determined by the combination of the "Location" textbox and the "Solution name" textbox (assuming you have not unchecked "Create new directory for solution"). Verify that this points to the location of the local Git repository that was created above.

Uncheck the "Create new Git repository" checkbox.

Make any other desired changes and click the [OK] button to create a new button.

At the New ASP.NET Application dialog (Fig. 7), click [OK] to create the project. 

VSTSp2-07VisualStudioNewASPNetProject
Fig. 7

A new project will be created in the repository directory similar to the one shown in the Solution Explorer (View | Solution Explorer) in Fig. 8.

VSTSp2-08VisualStudioSolutionExplorer
Fig. 8

You can check this initial code into your version control repository from the Visual Studio Team Explorer (View | Team Explorer). Click the [Changes] button in the Team Explorer to display the Changes panel, as shown in Fig. 9.

VSTSp2-09Changes
Fig. 9

Enter a comment, such as “Initial commit” and click the [Commit All] button. This will commit your changes to the local Git Repository.

To push your changes up to the VSTS repository, you will need to access the Team Explorer Sync panel. You can navigate to this panel by clicking to dropdown near the top of the Changes panel and selecting “Sync” from the menu displayed, as shown in Fig. 10.

VSTSp2-10TeamExplorerDropdown
Fig. 10

The Sync panel displays, as shown in Fig. 11.

VSTSp2-11SyncPanel
Fig. 11

Click the “Sync” link. You should see a message indicating that the local and remote repositories are syncing, meaning that the local repository is merging any changes from the remote repository and your local commits are being pushed up to the remote repository in VSTS. The following message displays when this sync is complete:

Successfully synchronized incoming and outgoing commits.

If you return to the project code page in VSTS and refresh the web page, you should see all your code checked in. Fig. 12 shows my project after I checked in my initial commit.

VSTSp2-12VSTSCode
Fig. 12

In this article, I showed you how to create a new ASP.NET project in Visual Studio and store the code in an existing Visual Studio Team Systems Git repository.

Wednesday, 04 October 2017 11:00:00 (GMT Daylight Time, UTC+01:00)
# Thursday, 06 October 2016

Lately, I've been using Visual Studio Code to create TypeScript projects.

When working with TypeScript, I always create a file with ".ts" extension and allow the TypeScript Compiler to create a ".js" and a ".map" file. It's rare that I ever open the js or map files, let alone modify them. In fact, it's a fool's errand to modify these files because they will be overwritten the next time the ".js" file changes.

So it is generally easier to work with a TypeScript project if I don't even see these files.

Visual Studio Code allows me to hide files in a project. To do so, select File | Preferences | Workplace Settings.

This creates a ".vscode" folder in the root of my project and adds a file named "settings.json" to this folder. In settings.json, add the following code:

{
"files.exclude": {
"**/*.js": true,
"**/*.map": true
}
}

Of course, you can add any file mask to this "files.exclude" extension to hide specific files or folders.

File matching patterns are described in this Help topic.

Save this file and the specified files will remain on disc but will not clutter the left pane of Visual Studio Code.

Thursday, 06 October 2016 05:32:33 (GMT Daylight Time, UTC+01:00)
# Monday, 29 August 2016
Monday, 29 August 2016 22:31:32 (GMT Daylight Time, UTC+01:00)
# Monday, 09 May 2016
Monday, 09 May 2016 16:07:00 (GMT Daylight Time, UTC+01:00)
# Tuesday, 23 February 2016
# Monday, 25 May 2015
Monday, 25 May 2015 14:27:00 (GMT Daylight Time, UTC+01:00)
# Saturday, 23 August 2014

When you install Visual Studio, you are prompted to opt into a program to help improve Visual Studio. If you answer “Yes”, Visual Studio will send information back to Microsoft about errors that occur and features that are used. The information is sent during installation and later during your normal course of using Visual Studio. The Visual Studio team uses this information to learn how their product is used, how often the product is used, and where errors are occurring. All this information is helpful as they improve the product.

If you have already installed Visual Studio, you can select from the menu:
Help | Customer Feedback Options

The following dialog (Fig. 1) displays:

image

Fig. 1

Click the radio button next to "Yes I am willing to participate" and click the [OK] button.

Of course, you can also opt out of the program by selecting the “No” radio button, but then you are not helping to improve the product. Those who opt out of this often do so because they fear for their privacy; but no personal information is transmitted, You can read about the privacy of your information here.

Microsoft makes it easy for you to share information about Visual Studio usage because they want this information to help to improve Visual Studio.

Saturday, 23 August 2014 02:05:00 (GMT Daylight Time, UTC+01:00)
# Saturday, 27 July 2013

Are you a TFS user or interested in using this product? In the past, it was necessary to install TFS onto a central server or virtual machine before using it. No more. Now, Team Foundation Services allows you to access a TFS server hosted by Microsoft.

The service is free for small teams (<5 people) while it is in Preview, but I have not seen any future pricing announcements.

Get started by navigating to visualstudio.com and signing up for an account. Note the URL, up to ".visualstudio.com". This is the server name. You will need this to integrate with Visual Studio solutions. In my case, it is "https://giard.visualstudio.com".

At the home page, click the [New Team Project] button (Fig. 1)

TFSvc1-Welcome[1]

The "Create Team Project" dialog displays (Fig. 2). Enter a project name and description;

TFSvc2-CreateTeamProject[1] 

Next, select a Process template. The choices are:

  • Microsoft Visual Studio Scrum 3.0 - Preview
  • MSF for Agile Software Development 7.0 - Preview
  • MSF for CMMI Process Improvement 7.0 - Preview

Finally, select a Version Control repository. Currently, TFS and Git are supported. Click [Create Project] and you will be ready to start using TFS within a few seconds.

The navigation is simple and intuitive.

You can add and remove team members by clicking the Manage All Members link.

You can enter a new Task, Bug, Issue, Feature, or Test Case using dialogues similar to those found in the Visual Studio Team Explorer.

The source control repository can be seen by clicking the "Code" link on the top menu. From here, you can download files but not upload them.

TFS source control is easiest to use when you integrate it with Visual Studio. Open a solution in Visual Studio and select File | Source Control | Add Solution to Source Control

You may be prompted to add a TFS server. If so, use the URL ending in ".visualstudio.com" that you noted from above. (Fig. 3)

TFSvc3-AddServer[1]

Select the Team project to which this solution belongs (Fig. 4) and click the [Connect] button.cl

iTFSvc4-SourceControl[1]

From here you check-in, check-out, branch, merge, and get latest in the same way that you would use a TFS server within your enterprise.

Microsoft is adding new features to this Team Foundation Service each week. You can follow the progress on Brian Harry's blog at http://blogs.msdn.com/b/bharry/archive/tags/tfservice/.

Team Foundation Service allows you to manage projects on your own or with organizations that don't have the hardware and/or time to set up their own TFS server. It can be a simple solution to integrating your project with Application Lifecycle Management tools.

Agile | ALM | TFS | Visual Studio
Saturday, 27 July 2013 19:39:05 (GMT Daylight Time, UTC+01:00)
# Thursday, 01 November 2012

This screencast demonstrates how to change a Visual Studio 2012 Coded UI Test after you have recorded it.

Thursday, 01 November 2012 14:28:00 (GMT Standard Time, UTC+00:00)
# Wednesday, 31 October 2012

This screencast shows how to add assertions to a Visual Studio 2012 Coded UI Test while recording your mouse and keyboard actions.

Wednesday, 31 October 2012 14:26:00 (GMT Standard Time, UTC+00:00)
# Tuesday, 30 October 2012

This screencast covers the fundamentals of Microsoft Coded UI Tests, a feature of Visual Studio 2012, Premium and Ultimate Editions. You will learn how to record mouse and keyboard actions to record a simple "smoke test".

Tuesday, 30 October 2012 14:25:00 (GMT Standard Time, UTC+00:00)
# Sunday, 28 October 2012
# Saturday, 27 October 2012

This screencast demonstrates how to change a Visual Studio 2010 Coded UI Test after you have recorded it.

Saturday, 27 October 2012 15:22:00 (GMT Daylight Time, UTC+01:00)
# Friday, 26 October 2012

This screencast shows how to add assertions to a Coded UI Test while recording your mouse and keyboard actions.

Friday, 26 October 2012 15:19:00 (GMT Daylight Time, UTC+01:00)
# Monday, 24 September 2012
Monday, 24 September 2012 14:03:36 (GMT Daylight Time, UTC+01:00)
# Tuesday, 28 August 2012

Here is Randy Pagels's presentation on What's New in Visual Studio 2012at the August 2012 Great Lakes Area .NET User Group meeting.

Tuesday, 28 August 2012 06:14:01 (GMT Daylight Time, UTC+01:00)
# Tuesday, 21 August 2012
Tuesday, 21 August 2012 04:27:41 (GMT Daylight Time, UTC+01:00)
# Monday, 11 June 2012
Monday, 11 June 2012 15:26:00 (GMT Daylight Time, UTC+01:00)
# Friday, 01 June 2012

Here is Kathleen Dollard’s presentation on .NET Framework Core Features at the April 2012 Great Lakes Area .NET User Group (GANG).

Friday, 01 June 2012 04:51:00 (GMT Daylight Time, UTC+01:00)
# Wednesday, 18 April 2012
Wednesday, 18 April 2012 15:20:00 (GMT Daylight Time, UTC+01:00)
# Monday, 20 February 2012
Monday, 20 February 2012 17:19:00 (GMT Standard Time, UTC+00:00)
# Monday, 05 December 2011
Monday, 05 December 2011 15:55:34 (GMT Standard Time, UTC+00:00)
# Monday, 31 January 2011
# Wednesday, 30 June 2010
Wednesday, 30 June 2010 22:58:30 (GMT Daylight Time, UTC+01:00)
# Monday, 17 May 2010

Episode 88

In this interview, Microsoft Product Unit Manager Cameron Skinner describes the architecture tools that his team built into Visual Studio 2010

Monday, 17 May 2010 10:55:01 (GMT Daylight Time, UTC+01:00)