Deploy to Azure Storage using VSTS
In this section, you will use Visual Studio Team Services (VSTS) to host and publish your application to Azure Storage. This is split into the following steps:
- Create a VSTS project.
- Push your app to the project repository.
- Create a CI (continuous integration) build/deploy pipeline.
- Use CI to build and publish your site on Azure Storage.
VSTS account - If you don't have an account, you can sign up here.
Git - We will use Git to push our code to our VSTS project. Install Git from git-scm.com
Create a VSTS project
Login to your VSTS profile.
Select an account.
Click New Project under the Projects tab.
Fill in your project details and click Create.
Push app to VSTS project repository
Expand the push an existing repository from command line section and copy the push commands.
Open a terminal at the root of the project we generated (or your own project). Now initialize a Git repository and make an initial commit.
git init # create a git repository git add -A # recursively add all files in current directory git commit -m "initial commit" # commit changes with supplied message
Paste the push commands to add the VSTS repository as a remote location and push your code to your VSTS repo.
git remote add origin https://<your-VSTS-account>.visualstudio.com/DefaultCollection/_git/<project-name> git push -u origin --all
git push, you should be able to refresh your VSTS project page and see your code!
Create a build/deploy pipeline
Click Build and Release > Builds from the top menu bar on the project home page.
Click the Import button in the top right and upload this build definition template.
A few settings will be missing that you must fill in on your own:
- In the Process section, select Hosted Linux Preview from the Agent queue drop down.
- Click on the Get sources section and let it update to automatically resolve the errors.
- Click on the Azure CLI section, select and authorize your Azure subscription, and then input the container we created earlier in place of
and in the Inline Script box.
You can find the connection string in Azure Portal under the Access Keys section after selecting your storage account.
Warning: Make sure you keep single quotes around the
When done, your AzureBlob File Copy settings should look like this:
Use CI to build and publish
Click Save & queue in the top right, then click Save & queue again with the default options in the following pop-up.
This will save this build definition and run it immediately with whatever is currently checked into your
A green success banner will pop-up at the top of your screen.
Clicking the hyperlinked number will take you to the current build.
Your build will wait in a queue and then a build agent will execute the steps we just configured.
This may take a few minutes. If there are multiple builds in the queue, you may need to wait for your turn.
If everything completes successfully, you will see a green success message along with the details of the build.
At this point, your app should be deployed and publicly available in your blob storage.
Navigate to your app entry point in a browser.
It should look something like this
If everything is working, you should see the following!