Azure Deployment

Prerequisites

• Azure CLI installed and authenticated
• An Azure subscription (free tier is sufficient)
• A GitHub repository for CI/CD

Deploy Infrastructure

The project uses Bicep templates in the infra/ directory.

# Login to Azure
az login

# Create resource group
az group create --name rg-choir-tickets --location westeurope

# Deploy infrastructure
az deployment group create \
  --resource-group rg-choir-tickets \
  --template-file infra/main.bicep \
  --parameters infra/main.bicepparam

This provisions:

• Azure Static Web App — hosts the Vue 3 frontend and Azure Functions API
• Azure Cosmos DB — NoSQL database (free tier: 1000 RU/s)
• Log Analytics workspace: stores production logs for 31 days
• Workspace-based Application Insights: sends Azure Functions telemetry to the linked workspace, where the effective retention is 31 days
• Baseline Azure Monitor alerts: watches failed requests, exceptions, failed dependencies, and daily ingestion

Deploy Application (GitHub Actions)

The recommended approach is CI/CD via GitHub Actions.

1. Get the deployment token

1. Go to Azure Portal → Static Web Apps
2. Click on your deployed Static Web App
3. Go to Deployment → Manage deployment token
4. Copy the token

2. Add the GitHub secret

Add the token as a GitHub repository secret named AZURE_STATIC_WEB_APPS_API_TOKEN.

3. Create the workflow

Create .github/workflows/deploy.yml:

name: Deploy to Azure Static Web Apps

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: "20"

      - name: Install and build API
        run: |
          cd api
          npm ci
          npm run build

      - name: Install and build frontend
        run: |
          cd frontend
          npm ci
          npm run build

      - name: Deploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/frontend/dist"
          api_location: "/api"
          output_location: ""
          skip_app_build: true
          skip_api_build: true

Post-Deployment Configuration

After deploying, configure these environment variables in Azure Portal → Static Web App → Configuration → Application settings:

Variable	Value
COSMOS_ENDPOINT	Your Cosmos DB endpoint
COSMOS_KEY	Your Cosmos DB primary key
COSMOS_DATABASE	choirtickets
JWT_SECRET	A strong random secret
FRONTEND_URL	Your Static Web App URL (e.g., https://billettsalg.vikingapps.dev)
RESEND_API_KEY	Your Resend API key
FROM_EMAIL	Billettsalg <noreply@yourdomain.com>

See Environment Variables for full details.

The Bicep deployment connects the Static Web App API to Application Insights. Don't copy the monitoring connection setting into documentation, deployment output, issues, or support messages.

Verify production monitoring

After deployment:

1. Open Application Insights → Overview and confirm that requests appear after you use the application.
2. Open Log Analytics workspace → Logs and confirm that recent Function traces arrive.
3. Open Azure Monitor → Alerts → Alert rules and confirm that four baseline rules are enabled.
4. Open Application Insights → Usage and estimated costs and confirm the 0.1 GB/day cap and 80 percent warning threshold.

The alerts are Portal-only. They don't have action groups, so Azure doesn't send email, SMS, or webhook notifications. Check the Azure Monitor alerts view during operational reviews.

Production Checklist

• [ ] Infrastructure deployed via Bicep
• [ ] GitHub Actions workflow configured
• [ ] All environment variables set in Azure Portal
• [ ] JWT_SECRET is a strong random value (not the dev default)
• [ ] RESEND_API_KEY and FROM_EMAIL configured for email delivery
• [ ] Cosmos DB firewall allows Azure services
• [ ] Application Insights receives recent API requests
• [ ] Log Analytics receives recent Function traces
• [ ] Four Portal-only alert rules are enabled
• [ ] Application Insights daily cap is 0.1 GB with an 80 percent warning
• [ ] Custom domain configured (optional)

---

Next: Hosting & Costs · See also: Local Development · Troubleshooting