Introduzione
In questo tutorial, creeremo un'applicazione containerizzata Next.js che visualizza una lista di servizi di un cloud provider, la pubblicheremo su Docker Hub e infine la deployeremo su un cluster Aruba Managed Kubernetes.
Inoltre, vedremo come aggiornare dinamicamente il contenuto della pagina senza dover ricostruire il container attraverso l'utilizzo di ConfigMap Kubernetes.
Prerequisiti
Prima di iniziare, assicurati di avere a disposizione:
Creazione dell'App Next.js
1. Crea una nuova app Next.js:
npx create-next-app@latest nextjs-demo-app
cd nextjs-demo-app
2. Crea l'utility di estrazione servizi /app/lib/services.js:
import fs from 'fs';
import path from 'path';
export async function getServices() {
const filePath = path.join("/config", "services.json");
try {
const data = fs.readFileSync(filePath, "utf-8");
return JSON.parse(data);
} catch (error) {
console.error("Failed to read services list", error);
return [];
}
}
3. Modifica /app/page.js per mostrare i servizi. Vedi /app/page.js.
Pubblicazione dell'Immagine su Docker Hub
1. Crea un Dockerfile nella cartella k8s/:
# Use official Node.js image
FROM node:18-alpine
# Set working directory inside the container
WORKDIR /app
# Copy package.json and package-lock.json from the Next.js app directory
COPY package.json package-lock.json ./
# Install dependencies using npm
RUN npm install --omit=dev
# Copy the entire Next.js app into the container
COPY . .
# Expose port and start app
EXPOSE 3000
CMD ["npm", "run", "start"]
2. Compila e pubblica l'immagine:
docker login
docker build -t tuo-utente-docker/nextjs-demo-app:latest -f ./k8s/Dockerfile .
docker push tuo-utente-docker/nextjs-demo-app:latest
Deployment su Aruba Managed Kubernetes
Configurazione del Cluster Aruba
1. Accedi al portale Aruba Cloud e apri il tuo ambiente Kubernetes.
2. Scarica il kubeconfig file per interagire con il cluster tramite kubectl.
3. Imposta il contesto kubectl per utilizzare il cluster.
Configurazione dei Manifest per il Cluster Aruba
1. Crea la risorsa ConfigMap con la lista dei servizi del Cloud Provider da mostrare nell'applicazione web:
apiVersion: v1
kind: ConfigMap
metadata:
name: cloud-services-config
namespace: nextjs-kaas
data:
services.json: |
[
"Cloud VPS",
"Aruba Cloud Server",
"Cloud Backup",
"Aruba Backup per Microsoft 365",
"Database as a Service (DBaaS)",
"Aruba Managed Hybrid Cloud",
"Aruba Managed Kubernetes",
"Virtual Private Cloud",
"Disaster Recovery as a Service (DRaaS)",
"Cloud Object Storage"
]
2. Crea il deployment:
apiVersion: apps/v1
kind: Deployment
metadata:
name: nextjs-demo-app
namespace: nextjs-kaas
spec:
replicas: 2
selector:
matchLabels:
app: nextjs-cloud
template:
metadata:
labels:
app: nextjs-cloud
spec:
containers:
- name: nextjs-demo-app
image: guidongui/nextjs-demo-app:latest
imagePullPolicy: Always
ports:
- containerPort: 3000
volumeMounts:
- name: config-volume
mountPath: /config
resources:
requests:
cpu: "100m"
memory: "128Mi"
limits:
cpu: "500m"
memory: "512Mi"
volumes:
- name: config-volume
configMap:
name: cloud-services-config
3. Crea il service:
apiVersion: v1
kind: Service
metadata:
name: nextjs-cloud-service
namespace: nextjs-kaas
spec:
selector:
app: nextjs-cloud
ports:
- protocol: TCP
port: 80
targetPort: 3000
type: ClusterIP
4. Applica il deployment:
kubectl create ns nextjs-kaas
kubectl apply -f k8s/
5. Verifica la corretta creazione dei pod e controlla i log applicativi:
kubectl get pods
kubectl logs -l app=nextjs-cloud
Dovresti vedere un output simile a questo:
Esposizione dell'Applicazione
Metodo 1: Port Forwarding
kubectl port-forward service/nextjs-cloud-service 8080:80
Ora l'app è accessibile su http://localhost:8080
Metodo 2: LoadBalancer
1. Crea un service con LoadBalancer:
apiVersion: v1
kind: Service
metadata:
name: nextjs-cloud-service
namespace: nextjs-kaas
spec:
selector:
app: nextjs-cloud
type: LoadBalancer
ports:
- protocol: TCP
port: 80
targetPort: 3000
2. Applica la configurazione:
kubectl apply -f k8s/service.YAML
3. Trova l'IP del servizio:
kubectl get svc nextjs-cloud-service
4. Accedi al servizio pubblico tramite http://[IP-loadbalancer].
Modifica del Contenuto della Pagina
1. Modifica il file services.json contenuto nella ConfigMap:
kubectl edit configmap cloud-services-config -n nextjs-kaas
2. Aspetta 10 secondi e ricarica la pagina.
L'app mostrerà i nuovi servizi!