Tips for using Azure Static Web Apps

I've recently converted two of my websites to Azure Static Web Apps and had a lot of fun not only learning how to use Hugo as the platform for these sites but also learning how easy and quick it is to get an Azure Static Web App set up and configured.

I wanted to share some tips and things I've noticed during these deployments to help you all out. 😊

Storage

With Azure Static Web Apps you have a limit to how big the website you are deploying can be.  This is no different to Azure Web Apps where you also have a file system storage quota.  

With the preview version of Azure Static Web Apps you were limited to 100MB but now with the Generally Available version you have 250MB of space in the free tier or 500MB if you are using the Standard (paid) tier.

So this is one to watch, there is no view of how much storage you are using within the Azure Portal, you'll need to keep a check of the size on your machine when working on our source files.

I have git-sizer installed on my machine so running git-sizer --verbose when working on my files can be a good checker.

Workflow

Azure Static Web Apps when used with GitHub can have only one GitHub Actions Workflow.  So be sure to remove any old YAML files created and that might be within your .github\workflows directory.

Although they won't necessarily cause any issues GitHub Actions will still try and run those old workflows and it'll cause you an admin headache, easily if they fail and you think it's your production workflow. 😉

Just HTML

Although Azure Static Web Apps is great for static web building and hosting, it can also handle just good old fashioned HTML websites.

You just need to set up the workflow to point to the right locations.  If you are using GitHub as your source code repository, your YAML workflow will look like this:

Assuming that the root directory of your GitHub repository is the root of the website.

There is also a skip app build functionality that you can use if you want full control of the build of your front end app.

Do let me know how you are getting on with Azure Static Web Apps and what tips you've learned!