chore: organize project structure and cleanup root directory
- Move all deployment documentation to docs/deployment/ (16 files) - Move all phase documentation to docs/phases/ (9 files) - Move deployment scripts to scripts/ (3 PowerShell scripts) - Remove temporary deployment zip files (5 files) - Remove duplicate documentation files - Create documentation indexes for better navigation - Clean up root directory to essential files only - Update documentation references Root directory reduced from ~50+ files to 20 essential files. All documentation properly organized and indexed.
This commit is contained in:
397
docs/deployment/COMPLETE_NEXT_STEPS.md
Normal file
397
docs/deployment/COMPLETE_NEXT_STEPS.md
Normal file
@@ -0,0 +1,397 @@
|
||||
# 🚀 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:
|
||||
|
||||
```bash
|
||||
# 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**
|
||||
|
||||
1. Go to: https://portal.azure.com
|
||||
2. Navigate to: Static Web App → `mim-prod-igiay4-web`
|
||||
3. Go to: **Deployment Center**
|
||||
4. Choose: **Upload** or **Connect to GitHub**
|
||||
5. Upload: `swa-deploy.zip` (already created) or connect repository
|
||||
|
||||
**Alternative: Fix SWA CLI**
|
||||
|
||||
The config has been fixed. Try:
|
||||
```bash
|
||||
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:**
|
||||
```bash
|
||||
# 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:**
|
||||
|
||||
```bash
|
||||
# 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:**
|
||||
```bash
|
||||
# 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:**
|
||||
|
||||
```bash
|
||||
# 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:**
|
||||
```bash
|
||||
# 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:**
|
||||
```bash
|
||||
# Ensure all required settings are present
|
||||
# (Already configured, but verify)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ☁️ Cloudflare Setup
|
||||
|
||||
### Step 5: Complete Cloudflare Configuration
|
||||
|
||||
**When Ready:**
|
||||
1. Add credentials to `.env.production`:
|
||||
```
|
||||
CLOUDFLARE_API_TOKEN=your-token
|
||||
CLOUDFLARE_ZONE_ID=your-zone-id
|
||||
```
|
||||
|
||||
2. Run automation:
|
||||
```bash
|
||||
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:**
|
||||
```bash
|
||||
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:**
|
||||
|
||||
```bash
|
||||
#!/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:**
|
||||
1. Use Azure Portal → Deployment Center → Upload zip
|
||||
2. Connect GitHub repository for automatic deployments
|
||||
3. Check deployment history in Azure Portal
|
||||
|
||||
### Function App Still Unavailable
|
||||
**Solutions:**
|
||||
1. Verify deployment package includes `host.json`
|
||||
2. Check Function App logs in Azure Portal
|
||||
3. Restart Function App: `az functionapp restart`
|
||||
4. Verify app settings are correct
|
||||
|
||||
### Endpoints Not Responding
|
||||
**Solutions:**
|
||||
1. Check Function App state: `az functionapp show`
|
||||
2. Review logs: Azure Portal → Function App → Logs
|
||||
3. Verify CORS settings if needed
|
||||
4. Check Application Insights for errors
|
||||
|
||||
---
|
||||
|
||||
## ✅ Success Criteria
|
||||
|
||||
**Deployment is COMPLETE when:**
|
||||
|
||||
- [x] Infrastructure deployed ✅
|
||||
- [ ] Static Web App shows your application ⚠️
|
||||
- [ ] Function App responds correctly ⚠️
|
||||
- [ ] All API endpoints work ⚠️
|
||||
- [x] Configuration verified ✅
|
||||
- [x] 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
|
||||
|
||||
1. **IMMEDIATE:** Deploy via GitHub Actions (push to main) OR Azure Portal
|
||||
2. **IMMEDIATE:** Deploy Function App code with proper package
|
||||
3. **VERIFY:** Test all endpoints
|
||||
4. **THEN:** Complete Cloudflare setup
|
||||
5. **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
|
||||
|
||||
Reference in New Issue
Block a user