---
# System prepended metadata

title: 'Recitation 5: Deploying to Azure'

---

# Recitation 5: Deploying to Azure

Link to full tutorial [here](https://docs.microsoft.com/en-us/azure/developer/javascript/tutorial/tutorial-vscode-docker-node/tutorial-vscode-docker-node-01?tabs=bash)

## Prerequisites

VS Code (for this specific tutorial)
Azure subscription/credits
Docker app
Docker extension
Azure App Service extension
Node/npm

## Steps

We're gonna deploy the todo-app-backend to Azure.

0. Open our `todo-app` project in vscode
1. Verify docker installation by running `docker -v` in terminal
2. Log into Azure through VS code extension
3. Create container registry for your app image
    4. `Shift+cmd+p` Create Registry
    5. Type name (must be unique, so it may have to be a bit cryptic)
    6. Select Basic
    7. Create resource group if necessary
    8. Select region (probably US)
9. VScode will create registry in Azure, and notify you in the bottom right when its done.
10. Open Docker tab (on the left), check that the registry appears there.
11. Add docker files to workspace (shift cmd p)
    12. Select Node.js
    13. Select the proper package.json file
    14. NO docker compose files
12. Launch the Docker Daemon if you haven't already (this is the Docker app, usually outside of vscode)
13. (back to vscode) Run (shift cmd p) Docker Images: Build Image...
14. The new image should appear in the docker tab under Images
15. Rightclick the new image, and hit Tag...
16. Type the name of your Docker container registry (it has to match)
    17. Then, append `.azurecr.io/[app name]:latest`
    18. For the tutorial, the full image name is `todoapp17356s21.azurecr.io/todoappbackend:latest`
17. Expand the NEW docker image (that should have popped up), rightclick the latest tag and hit Push...
    18. The default input for the tag should be fine
    19. IF "authentication required" then you need to install [Azure CLI](https://docs.microsoft.com/en-us/cli/azure/) (I had to do this step)
    20. Login with `az acr login --name [your registry name]`
    21. Try to push again. It should work.
    18. IF that still doesn't work, try manually docker push
        19. `docker push [registry name]:[tag]`
        20. Mine was `docker push todoapp17356s21.azurecr.io/todoappbackend:latest`
18. Your image should now be in the azure container registry (check that)
19. Now to push it to azure app service:
20. Right click on your registry under the Docker Registries tab
21. Select open in portal
22. Click Access Keys (leftside menu bar, should be first item)
23. Toggle "Admin User" to enabled
24. Reload your vscode window
25. Right click the latest image under registries, and deploy to azure app service
26. Type a name, select the resource group, and create an app service plan.
    27. IF everything went well, you should be done. Copy the URL that was included in the success message (bottom right toast) and see your backend!
    28. IF you got an error (like me) and it was to do with an unregistered namespace, continue on:
    29. Go to your azure dashboard, and navigate to "Subscriptions"
    30. Go into your subscription
    31. Scroll down and select "Resource Providers" (5th from bottom menu option)
    32. Search for the missing resource provider (mine was "Microsoft.Web") and register for it.
    33. Retry the deployment.
27. If you lost the URL, you can always look at your docker output to get it back.