Scaffolding Static Web Apps

Modified version of this comic

Over the past 18 months I’ve created a lot of Azure Static Web Apps, like… a lot. I’ve hit the quota of free apps several times and had to clean out demos to keep testing things!

But it’s always a little bit tedious, running create-react-app, setting up Functions, etc. so I went about creating a GitHub repo template for a basic React + TypeScript + Functions app. Then sometimes I’d be wanting a different framework, so I’d go off hunting for a new template, rinse and repeat.

Enter create-swa-app

To tackle this, I decided to create a command line tool to be used with npm init, @aaronpowell/swa-app, which will guide you through the creation using one of the templates that is listed on awesome-static-web-apps. It will also offer to create a GitHub repo for you using the template (this will prompt for a GitHub sign in workflow), so you’ll be ready to deploy it to Azure!

Think of this as a helpful starting point before jumping into the SWA CLI or VS Code extension.

Hopefully you’ll find this as a useful way to scaffold up a Static Web Apps project!