- Restore blue PageHeader on Dashboard (/app-components) - Update homepage (/) with subtle header design without blue bar - Add uniform PageHeader styling to application edit page - Fix Rapporten link on homepage to point to /reports overview - Improve header descriptions spacing for better readability
7.8 KiB
7.8 KiB
Quick Deployment Guide - Van Images naar Productie 🚀
Je Docker images zijn klaar! Hier is een snelle guide om ze te deployen.
🎯 Snelle Keuze: Welke Deployment Optie?
Voor 20 gebruikers, productie: → Azure App Service (Managed, eenvoudig, ~€20/maand)
Voor test/development: → VM met Docker Compose (Flexibel, snel op te zetten)
Voor enterprise/scale: → Azure Kubernetes Service (Complex, maar krachtig)
⚡ Optie 1: Azure App Service (Aanbevolen) - 15 minuten
Stap 1: Maak App Service Plan aan
# Resource Group (als nog niet bestaat)
az group create --name rg-cmdb-gui --location westeurope
# App Service Plan (Basic B1 - voldoende voor 20 gebruikers)
az appservice plan create \
--name plan-cmdb-gui \
--resource-group rg-cmdb-gui \
--sku B1 \
--is-linux
Stap 2: Maak Web Apps aan
# Backend Web App
az webapp create \
--name cmdb-backend-prod \
--resource-group rg-cmdb-gui \
--plan plan-cmdb-gui \
--deployment-container-image-name zdlas.azurecr.io/cmdb-insight/backend:latest
# Frontend Web App
az webapp create \
--name cmdb-frontend-prod \
--resource-group rg-cmdb-gui \
--plan plan-cmdb-gui \
--deployment-container-image-name zdlas.azurecr.io/cmdb-insight/frontend:latest
Stap 3: Configureer ACR Authentication
# Enable managed identity
az webapp identity assign \
--name cmdb-backend-prod \
--resource-group rg-cmdb-gui
az webapp identity assign \
--name cmdb-frontend-prod \
--resource-group rg-cmdb-gui
# Grant ACR pull permissions
az acr update \
--name zdlas \
--admin-enabled true
# Configure ACR credentials
az webapp config container set \
--name cmdb-backend-prod \
--resource-group rg-cmdb-gui \
--docker-custom-image-name zdlas.azurecr.io/cmdb-insight/backend:latest \
--docker-registry-server-url https://zdlas.azurecr.io \
--docker-registry-server-user $(az acr credential show --name zdlas --query username -o tsv) \
--docker-registry-server-password $(az acr credential show --name zdlas --query passwords[0].value -o tsv)
az webapp config container set \
--name cmdb-frontend-prod \
--resource-group rg-cmdb-gui \
--docker-custom-image-name zdlas.azurecr.io/cmdb-insight/frontend:latest \
--docker-registry-server-url https://zdlas.azurecr.io \
--docker-registry-server-user $(az acr credential show --name zdlas --query username -o tsv) \
--docker-registry-server-password $(az acr credential show --name zdlas --query passwords[0].value -o tsv)
Stap 4: Configureer Environment Variabelen
# Backend environment variables
az webapp config appsettings set \
--name cmdb-backend-prod \
--resource-group rg-cmdb-gui \
--settings \
NODE_ENV=production \
PORT=3001 \
JIRA_BASE_URL=https://jira.zuyderland.nl \
JIRA_SCHEMA_ID=your-schema-id \
SESSION_SECRET=your-secure-secret \
FRONTEND_URL=https://cmdb-frontend-prod.azurewebsites.net
# Frontend environment variables
az webapp config appsettings set \
--name cmdb-frontend-prod \
--resource-group rg-cmdb-gui \
--settings \
VITE_API_URL=https://cmdb-backend-prod.azurewebsites.net/api
Stap 5: Configureer SSL (Gratis via App Service)
# App Service heeft automatisch SSL via *.azurewebsites.net
# Voor custom domain:
az webapp config hostname add \
--webapp-name cmdb-frontend-prod \
--resource-group rg-cmdb-gui \
--hostname cmdb.zuyderland.nl
# Bind SSL certificate
az webapp config ssl bind \
--name cmdb-frontend-prod \
--resource-group rg-cmdb-gui \
--certificate-thumbprint <thumbprint> \
--ssl-type SNI
Stap 6: Start de Apps
az webapp start --name cmdb-backend-prod --resource-group rg-cmdb-gui
az webapp start --name cmdb-frontend-prod --resource-group rg-cmdb-gui
Je applicatie is nu live op:
- Frontend:
https://cmdb-frontend-prod.azurewebsites.net - Backend API:
https://cmdb-backend-prod.azurewebsites.net/api
🖥️ Optie 2: VM met Docker Compose - 20 minuten
Stap 1: Maak VM aan
az vm create \
--resource-group rg-cmdb-gui \
--name vm-cmdb-gui \
--image Ubuntu2204 \
--size Standard_B2s \
--admin-username azureuser \
--generate-ssh-keys \
--public-ip-sku Standard
Stap 2: SSH naar VM en installeer Docker
# SSH naar VM
ssh azureuser@<vm-public-ip>
# Installeer Docker
curl -fsSL https://get.docker.com -o get-docker.sh
sudo sh get-docker.sh
sudo usermod -aG docker $USER
newgrp docker
# Installeer Docker Compose
sudo curl -L "https://github.com/docker/compose/releases/latest/download/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose
Stap 3: Login naar ACR
# Installeer Azure CLI (als nog niet geïnstalleerd)
curl -sL https://aka.ms/InstallAzureCLIDeb | sudo bash
az login
# Login naar ACR
az acr login --name zdlas
# OF gebruik credentials
az acr credential show --name zdlas
docker login zdlas.azurecr.io -u <username> -p <password>
Stap 4: Clone Repository en Deploy
# Clone repository
git clone <your-repo-url>
cd cmdb-insight
# Maak .env.production aan
nano .env.production
# (Plak je environment variabelen)
# Update docker-compose.prod.acr.yml (ACR naam is al correct: zdlas)
# Start containers
docker-compose -f docker-compose.prod.acr.yml up -d
# Check status
docker-compose -f docker-compose.prod.acr.yml ps
docker-compose -f docker-compose.prod.acr.yml logs -f
Stap 5: Configureer Nginx en SSL
# Installeer certbot voor Let's Encrypt
sudo apt update
sudo apt install certbot python3-certbot-nginx -y
# Configureer SSL
sudo certbot --nginx -d cmdb.zuyderland.nl
🔍 Verificatie
Test of alles werkt:
# Check backend health
curl https://your-backend-url/api/health
# Check frontend
curl https://your-frontend-url
# Check container logs
docker-compose -f docker-compose.prod.acr.yml logs backend
docker-compose -f docker-compose.prod.acr.yml logs frontend
🔄 Updates Deployen
Wanneer je code pusht naar main:
- Pipeline bouwt automatisch nieuwe images
- Images worden gepusht naar ACR met nieuwe tag
- Pull nieuwe images:
# VM met Docker Compose docker-compose -f docker-compose.prod.acr.yml pull docker-compose -f docker-compose.prod.acr.yml up -d # App Service (automatisch via Continuous Deployment) az webapp restart --name cmdb-backend-prod --resource-group rg-cmdb-gui
📝 Environment Variabelen Template
Maak .env.production aan:
# Backend
NODE_ENV=production
PORT=3001
# Jira
JIRA_BASE_URL=https://jira.zuyderland.nl
JIRA_SCHEMA_ID=your-schema-id
JIRA_PAT=your-pat-token
# OF OAuth
JIRA_OAUTH_CLIENT_ID=your-client-id
JIRA_OAUTH_CLIENT_SECRET=your-client-secret
JIRA_OAUTH_CALLBACK_URL=https://your-domain/api/auth/callback
# Session
SESSION_SECRET=$(openssl rand -hex 32)
# AI (Optioneel)
ANTHROPIC_API_KEY=your-key
OPENAI_API_KEY=your-key
# Database (als PostgreSQL)
DATABASE_URL=postgresql://user:pass@host:5432/db
# Frontend
VITE_API_URL=https://your-backend-url/api
⚠️ BELANGRIJK: Gebruik Azure Key Vault voor secrets in productie!
🎯 Volgende Stappen
- Kies deployment optie (App Service of VM)
- Configureer environment variabelen
- Deploy en test
- Configureer SSL/TLS
- Setup monitoring
- Documenteer voor team
📚 Meer Informatie
- Volledige Deployment Guide:
docs/DEPLOYMENT-NEXT-STEPS.md - Production Deployment:
docs/PRODUCTION-DEPLOYMENT.md - Azure Deployment Summary:
docs/AZURE-DEPLOYMENT-SUMMARY.md
✅ Success Checklist
- Images geverifieerd in ACR
- Deployment optie gekozen
- Environment variabelen geconfigureerd
- Applicatie gedeployed
- SSL/TLS geconfigureerd
- Health checks werken
- Monitoring ingesteld
- Team geïnformeerd
Veel succes met de deployment! 🚀