Hosting moved to Azure Static Web Site

In order to reduce costs I have moved the site from an www.one.com to an Azure Static Web Site which offers free hosting. As the site is fully static already I do not need the PHP and DB stuff that comes with a hosting plan on www.one.com.

Basic Steps

The steps needed

  • Create the Azure Static Web App via the Azure portal
  • Get the API key of the Azure Static Web App and put it in a Github Action secret (AXURE_STATIC_WEB_APPS_API_TOKEN)
  • Create a Github action deployment script
  • Push changes

Additionally, I setup my domain to point to the Azure.

Preparation

Having

  • Hugo installed locally
  • The repository of the site cloned locally
  • The theme of the site cloned locally

allows the use of hugo server to watch how new articles and other changes affect the site. When done push and merge.

Deployment Github Action

Putting the following in .github/workflows/deploy-to-azure-static-site.yaml publishes an updated site to scicomp.dk whenever the main branch is updated.

The steps are

  1. Checkout the repository itself containing articles and configuration for Hugo

  2. Checkout the theme - currently it is a patched version of Mainroad. See later

  3. Build the web site

  4. Run the Pagefind indexing such that search is updated.

  5. Publish the site to Azure Static Web Apps. It seems that the azure_static_web_apps_api_token is mapped by Azure to my static web site setup.

name: Build and Deploy to Azure Static Site
on:
  push:
    branches:
      - main
jobs:
  Explore-GitHub-Actions:
    runs-on: ubuntu-latest
    steps:   
      - name: Check out the site source
        uses: actions/checkout@v4
      
      - name: Checkout theme 
        uses: actions/checkout@v4
        with:
          repository: jacksondk/Mainroad
          path: themes/mainroad
      
      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v3
        with:
          hugo-version: '0.140.2'

      - name: Build site with Hugo
        run: hugo

      - name: Generate pagefind index
        run: npx pagefind --site public 

      - name: Deploy site to Azure
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          action: "upload"
          skip_app_build: true          
          app_location: "public" # Hugo compiles to public
          api_location: "" # Not used          
          github_id_token: ${{ steps.idtoken.outputs.result }}

Theme adjustments

The main changes are

  • At the time of writing Mainroad was not compatible with the latest version of Hugo. Also,

  • I have adjusted the ‘search’ widget to use the Pagefind static search library.