DEV Community

Cover image for Scaffolding Static Web Apps
Aaron Powell for Microsoft Azure

Posted on • Originally published at on

Scaffolding Static Web Apps

Jesus that’s a lot of Static Web Apps (meme)

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

create-swa-app demo

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!

Top comments (2)

alexweininger profile image
Alex Weininger

Hi Aaron, this is cool!

Any chance this becomes an official tool? Or maybe added into the SWA CLI?

aaronpowell profile image
Aaron Powell

Good question @alexweininger - In the future I might look to merge it in with the SWA CLI, we've got an open issue on it here -

The thing I'd like to explore on building in official CLI support is the DX of this experience. Given that npm init is a common workflow for scaffolding, will is be as discoverable as doing swa init, given you'd need to have the CLI already installed? Or, is the anticipated user of it someone who's already familiar with SWA and has the CLI pre-installed?

Mostly, this is a tool for solving problems that I have, and I pushed it as OSS so that others can use it if required, and to help gather insights for the SWA CLI.