- Frontend folder contains the website
- main.js contains the visitor counter code
Create a blank project called azure-resume in GitHub.
Clone it into /repo/azure
Clone the source starter project into /repo/azure - Link to Starter project
Copy both backend and frontend projects from the cloned starter project into your azure-resume project
Edit the index.html in the frontend folder in the azure-resume project
Create main.js in the frontend folder of your project
Create the Azure Function using the steps outlined in the video
Add the AzureResumeConnectionString variable to local.settings.json
Create the Counter.cs file
Update GetResumeCounter.cs
-
Functions Core Tools - you will need to install the core tools from here Functions Core Tools. I used the v4 the self-contained platform image on my Mac, and it worked just fine.
-
Dotnet SDK v6 - updates required to the CosmosDB HTTP trigger
-
Function Core Tools flaky behaviour - I experienced some intermittent behaviour on my Mac when running the function locally using Functions Core Tools. It would, on occaision not work, reporting a host configuration change error, usually because a file change had been detected. Even when it hadn't.
If this happens to you, try running dotnet restore, followed by dotnet build. And here is an example of the function running OK locally, you should see something similar
With the browser showing..
Uninstall and reinstall Azure Functions Core Tools
# Uninstall Azure Functions Core Tools
npm uninstall -g azure-functions-core-tools@4
#Clear the NPM cache
npm cache clean --force
#Install Azure Functions Core Tools
npm i -g azure-functions-core-tools@4 --unsafe-perm true
# Install dependencies
npm install
# Start function with verbose logging
func start --verbose
Note your version of azure-functions-core-tools may be different to the latest at the time of writing *@4
Steps are as follows
- In the root folder of your project, create a .github directory
- cd into it
- make a directory called workflows
- cd into it
- create a frontend.main.yml file
touch frontend.main.yml
- create a backend.main.yml file
- create the SP used for deployment
az ad sp create-for-rbac --name <yourspname>-sp --role contributor --scopes /subscriptions/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/resourceGroups/azureresumedr --sdk-auth
- Follow the steps in this article