d-bis/miracles_in_motion

Fork 0

Files

defiQUG f1c61c8339 Deploy to production - ensure all endpoints operational

2025-11-12 08:17:28 -08:00

10 KiB

Raw Blame History

🚀 Complete Next Steps - Full Deployment Guide

Date: November 12, 2025
Objective: Ensure ALL endpoints are fully deployed and operational

📊 Current Status Summary

✅ Infrastructure: COMPLETE

All 9 Azure resources deployed
Static Web App: Created (Standard SKU)
Function App: Created and running
Configuration: Complete

⚠️ Application Deployment: NEEDS ACTION

Static Web App: Shows default Azure page (needs frontend deployment)
Function App: Service unavailable (needs proper deployment)
Endpoints: Not fully operational yet

🎯 CRITICAL: Immediate Deployment Steps

Step 1: Deploy Frontend to Static Web App ⚠️ HIGH PRIORITY

Current Issue: Static Web App shows Azure default page instead of your React application.

Best Solution: Use GitHub Actions (Recommended)

You have a GitHub repository connected with a production deployment workflow. This is the most reliable method:

# Option A: Trigger GitHub Actions deployment
git add .
git commit -m "Deploy to production - ensure endpoints operational"
git push origin main

# The workflow will automatically:
# - Build frontend and API
# - Deploy to Static Web App
# - Deploy Function App functions
# - Run smoke tests

Alternative: Azure Portal Deployment

Go to: https://portal.azure.com
Navigate to: Static Web App → mim-prod-igiay4-web
Go to: Deployment Center
Choose: Upload or Connect to GitHub
Upload: swa-deploy.zip (already created) or connect repository

Alternative: Fix SWA CLI

The config has been fixed. Try:

DEPLOY_TOKEN=$(az staticwebapp secrets list \
  --name mim-prod-igiay4-web \
  --resource-group rg-miraclesinmotion-prod \
  --query "properties.apiKey" -o tsv)

swa deploy ./dist \
  --env production \
  --deployment-token $DEPLOY_TOKEN \
  --no-use-keychain

Verify:

# Should show your React app HTML, not Azure default page
curl https://lemon-water-015cb3010.3.azurestaticapps.net | grep -i "miracles\|react\|vite"

Step 2: Deploy Function App Code ⚠️ HIGH PRIORITY

Current Issue: Function App shows "service unavailable" - needs proper function deployment.

Deployment Steps:

# 1. Build API
cd api
npm run build
cd ..

# 2. Create proper deployment package (includes host.json)
cd api
mkdir -p deploy-package
cp -r dist/* deploy-package/
cp host.json deploy-package/
cp package.json deploy-package/
cd deploy-package
zip -r ../../api-func-deploy-proper.zip .
cd ../..

# 3. Deploy to Function App
az functionapp deployment source config-zip \
  --resource-group rg-miraclesinmotion-prod \
  --name mim-prod-igiay4-func \
  --src api-func-deploy-proper.zip

# 4. Restart Function App
az functionapp restart \
  --name mim-prod-igiay4-func \
  --resource-group rg-miraclesinmotion-prod

# 5. Wait a moment, then test
sleep 10
curl https://mim-prod-igiay4-func.azurewebsites.net

Verify Functions:

# Test function endpoints
curl https://mim-prod-igiay4-func.azurewebsites.net/api/donations
curl https://mim-prod-igiay4-func.azurewebsites.net/api/health

# Check Function App status
az functionapp show \
  --name mim-prod-igiay4-func \
  --resource-group rg-miraclesinmotion-prod \
  --query "{state:state, defaultHostName:defaultHostName}"

✅ Verification Steps

Step 3: Verify All Endpoints Are Operational

Comprehensive Testing:

# 1. Static Web App - should show your app
echo "=== Testing Static Web App ==="
curl -I https://lemon-water-015cb3010.3.azurestaticapps.net
curl -s https://lemon-water-015cb3010.3.azurestaticapps.net | head -20

# 2. Function App - should respond
echo "=== Testing Function App ==="
curl -I https://mim-prod-igiay4-func.azurewebsites.net
curl -s https://mim-prod-igiay4-func.azurewebsites.net

# 3. API Endpoints - should return JSON
echo "=== Testing API Endpoints ==="
curl https://mim-prod-igiay4-func.azurewebsites.net/api/donations
curl https://mim-prod-igiay4-func.azurewebsites.net/api/health

# 4. Run automated tests
bash scripts/test-deployment.sh

Success Criteria:

✅ Static Web App returns your React application HTML
✅ Function App responds (200 OK or function responses)
✅ API endpoints return JSON or proper responses
✅ No "service unavailable" errors
✅ No Azure default pages

🔧 Configuration Verification

Step 4: Verify All Settings

Check Environment Variables:

# Static Web App
az staticwebapp appsettings list \
  --name mim-prod-igiay4-web \
  --resource-group rg-miraclesinmotion-prod

# Function App
az functionapp config appsettings list \
  --name mim-prod-igiay4-func \
  --resource-group rg-miraclesinmotion-prod \
  --query "[?name=='KEY_VAULT_URL' || name=='APPINSIGHTS_INSTRUMENTATIONKEY' || name=='STRIPE_SECRET_KEY']"

Update if Missing:

# Ensure all required settings are present
# (Already configured, but verify)

☁️ Cloudflare Setup

Step 5: Complete Cloudflare Configuration

When Ready:

Add credentials to .env.production:

CLOUDFLARE_API_TOKEN=your-token
CLOUDFLARE_ZONE_ID=your-zone-id

Run automation:
```
bash scripts/setup-cloudflare-auto.sh
```

What it configures:

DNS records
SSL/TLS
Security settings
Performance optimizations

🌐 Custom Domain

Step 6: Configure Custom Domain

After Cloudflare or DNS is ready:

az staticwebapp hostname set \
  --name mim-prod-igiay4-web \
  --resource-group rg-miraclesinmotion-prod \
  --hostname "mim4u.org"

az staticwebapp hostname set \
  --name mim-prod-igiay4-web \
  --resource-group rg-miraclesinmotion-prod \
  --hostname "www.mim4u.org"

📋 Complete Deployment Checklist

Critical (Do Now)

Deploy Frontend - Static Web App needs your application
Deploy Functions - Function App needs function code
Verify Endpoints - Ensure all respond correctly
Test Functionality - Verify API endpoints work

Important (Do Next)

Complete Cloudflare - Performance and security
Configure Custom Domain - Professional URL
Final Testing - Comprehensive verification

Optional (Can Do Later)

Performance Optimization - Fine-tune response times
Additional Monitoring - More detailed alerts

🚀 Quick Deployment Script

Complete deployment in one command sequence:

#!/bin/bash
# Complete Deployment Script

set -e

echo "🚀 Starting Complete Deployment"

# 1. Build everything
echo "📦 Building applications..."
npm run build
cd api && npm run build && cd ..

# 2. Deploy Function App
echo "⚡ Deploying Function App..."
cd api
mkdir -p deploy-package
cp -r dist/* deploy-package/
cp host.json deploy-package/
cp package.json deploy-package/
cd deploy-package
zip -r ../../api-func-deploy-proper.zip .
cd ../..
az functionapp deployment source config-zip \
  --resource-group rg-miraclesinmotion-prod \
  --name mim-prod-igiay4-func \
  --src api-func-deploy-proper.zip
az functionapp restart \
  --name mim-prod-igiay4-func \
  --resource-group rg-miraclesinmotion-prod

# 3. Deploy Static Web App (choose method)
echo "🌐 Deploying Static Web App..."
# Option A: GitHub Actions (recommended)
echo "Push to GitHub to trigger deployment, or use Azure Portal"

# Option B: SWA CLI
DEPLOY_TOKEN=$(az staticwebapp secrets list \
  --name mim-prod-igiay4-web \
  --resource-group rg-miraclesinmotion-prod \
  --query "properties.apiKey" -o tsv)
swa deploy ./dist \
  --env production \
  --deployment-token $DEPLOY_TOKEN \
  --no-use-keychain || echo "SWA CLI failed, use Azure Portal"

# 4. Verify
echo "✅ Verifying deployment..."
sleep 15
curl -I https://lemon-water-015cb3010.3.azurestaticapps.net
curl -I https://mim-prod-igiay4-func.azurewebsites.net

echo "🎉 Deployment complete!"

📊 Expected Results After Deployment

Static Web App

Before: Azure default page
After: Your React application with Miracles in Motion content
URL: https://lemon-water-015cb3010.3.azurestaticapps.net

Function App

Before: "Service unavailable"
After: Function responses or proper API endpoints
URL: https://mim-prod-igiay4-func.azurewebsites.net

API Endpoints

Before: 404 or unavailable
After: JSON responses from your functions
Endpoints:
- /api/donations
- /api/health
- Other function endpoints

🆘 Troubleshooting

Static Web App Still Shows Default Page

Solutions:

Use Azure Portal → Deployment Center → Upload zip
Connect GitHub repository for automatic deployments
Check deployment history in Azure Portal

Function App Still Unavailable

Solutions:

Verify deployment package includes host.json
Check Function App logs in Azure Portal
Restart Function App: az functionapp restart
Verify app settings are correct

Endpoints Not Responding

Solutions:

Check Function App state: az functionapp show
Review logs: Azure Portal → Function App → Logs
Verify CORS settings if needed
Check Application Insights for errors

✅ Success Criteria

Deployment is COMPLETE when:

Infrastructure deployed ✅
Static Web App shows your application ⚠️
Function App responds correctly ⚠️
All API endpoints work ⚠️
Configuration verified ✅
Monitoring active ✅

📚 Reference

Detailed Next Steps: NEXT_STEPS_COMPLETE.md
Deployment Status: DEPLOYMENT_STATUS.md
GitHub Actions: .github/workflows/production-deployment.yml

🎯 Recommended Action Plan

IMMEDIATE: Deploy via GitHub Actions (push to main) OR Azure Portal
IMMEDIATE: Deploy Function App code with proper package
VERIFY: Test all endpoints
THEN: Complete Cloudflare setup
THEN: Configure custom domain

🚀 Focus: Deploy frontend and Function App code to make all endpoints fully operational!

Next Action:

Option 1 (Recommended): Push to GitHub to trigger automatic deployment
Option 2: Use Azure Portal to deploy Static Web App
Option 3: Deploy Function App code using the proper package structure

10 KiB Raw Blame History

🚀 Complete Next Steps - Full Deployment Guide

📊 Current Status Summary

✅ Infrastructure: COMPLETE

⚠️ Application Deployment: NEEDS ACTION

🎯 CRITICAL: Immediate Deployment Steps

Step 1: Deploy Frontend to Static Web App ⚠️ HIGH PRIORITY

Step 2: Deploy Function App Code ⚠️ HIGH PRIORITY

✅ Verification Steps

Step 3: Verify All Endpoints Are Operational

🔧 Configuration Verification

Step 4: Verify All Settings

☁️ Cloudflare Setup

Step 5: Complete Cloudflare Configuration

🌐 Custom Domain

Step 6: Configure Custom Domain

📋 Complete Deployment Checklist

Critical (Do Now)

Important (Do Next)

Optional (Can Do Later)

🚀 Quick Deployment Script

📊 Expected Results After Deployment

Static Web App

Function App

API Endpoints

🆘 Troubleshooting

Static Web App Still Shows Default Page

Function App Still Unavailable

Endpoints Not Responding

✅ Success Criteria

📚 Reference

🎯 Recommended Action Plan

10 KiB

Raw Blame History