assignment 2
This commit is contained in:
parent
3dcf0d0a81
commit
d558806fa9
13
z2/Dockerfile
Normal file
13
z2/Dockerfile
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
# Stage 1: Build
|
||||||
|
FROM node:18-alpine as builder
|
||||||
|
WORKDIR /app
|
||||||
|
COPY package*.json ./
|
||||||
|
RUN npm install
|
||||||
|
COPY . .
|
||||||
|
RUN npm run build
|
||||||
|
|
||||||
|
# Stage 2: Run
|
||||||
|
FROM nginx:alpine
|
||||||
|
COPY --from=builder /app/dist /usr/share/nginx/html
|
||||||
|
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||||||
|
EXPOSE 80
|
144
z2/README.md
Normal file
144
z2/README.md
Normal file
@ -0,0 +1,144 @@
|
|||||||
|
# Kubernetes Task Manager - Technical Documentation
|
||||||
|
|
||||||
|
## Project Purpose
|
||||||
|
|
||||||
|
This project demonstrates a production-like Kubernetes deployment featuring:
|
||||||
|
- Multi-container application
|
||||||
|
- Persistent storage
|
||||||
|
- Scalable frontend
|
||||||
|
- Proper resource management
|
||||||
|
|
||||||
|
## Deployment Components
|
||||||
|
|
||||||
|
### Core Objects
|
||||||
|
|
||||||
|
| Object Type | Name | Purpose |
|
||||||
|
|-------------------|---------------------|------------------------------------------------------------------|
|
||||||
|
| `Namespace` | `web-app` | Isolates all application resources |
|
||||||
|
| `Deployment` | `web-app` | Manages 2 replicas of frontend pods |
|
||||||
|
| `StatefulSet` | `mysql` | Manages database pod with stable network identity
|
||||||
|
|
||||||
|
| `Service` | `web-app-service` | Exposes frontend on NodePort 30080 |
|
||||||
|
| `PersistentVolume`| `mysql-pv` | Provides 5Gi storage for database |
|
||||||
|
|
||||||
|
### Container Images
|
||||||
|
|
||||||
|
| Component | Image | Port | Notes |
|
||||||
|
|-----------|-----------------------------|------|----------------------------------------|
|
||||||
|
| Frontend | `k8s-task-manager-frontend` | 80 | Custom-built Nginx image |
|
||||||
|
| Database | `mysql:5.7` | 3306 | With preconfigured credentials |
|
||||||
|
| Backend | `k8s-task-manager-api` | 8080 | Node.js/Express REST API |
|
||||||
|
|
||||||
|
## Deployment Workflow
|
||||||
|
|
||||||
|
```mermaid
|
||||||
|
graph TD
|
||||||
|
A[prepare-app.sh] --> B[Creates PV directories]
|
||||||
|
B --> C[Builds frontend image]
|
||||||
|
C --> D[start-app.sh]
|
||||||
|
D --> E[Creates Namespace]
|
||||||
|
E --> F[Deploys PV/PVC]
|
||||||
|
F --> G[Deploys MySQL StatefulSet]
|
||||||
|
G --> H[Deploys Frontend]
|
||||||
|
H --> I[Creates Service]
|
||||||
|
|
||||||
|
# Key Configuration Details
|
||||||
|
## Resource Allocation
|
||||||
|
|
||||||
|
Frontend:
|
||||||
|
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
cpu: "100m"
|
||||||
|
memory: "128Mi"
|
||||||
|
limits:
|
||||||
|
cpu: "250m"
|
||||||
|
memory: "256Mi"
|
||||||
|
|
||||||
|
|
||||||
|
Database:
|
||||||
|
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
cpu: "500m"
|
||||||
|
memory: "512Mi"
|
||||||
|
limits:
|
||||||
|
cpu: "1000m"
|
||||||
|
memory: "1Gi"
|
||||||
|
|
||||||
|
Backend:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
cpu: "200m"
|
||||||
|
memory: "256Mi"
|
||||||
|
limits:
|
||||||
|
cpu: "500m"
|
||||||
|
memory: "512Mi"
|
||||||
|
|
||||||
|
Storage Configuration
|
||||||
|
|
||||||
|
# persistentvolume.yaml
|
||||||
|
spec:
|
||||||
|
capacity:
|
||||||
|
storage: 5Gi
|
||||||
|
accessModes:
|
||||||
|
- ReadWriteOnce
|
||||||
|
hostPath:
|
||||||
|
path: "/mnt/data/mysql"
|
||||||
|
|
||||||
|
|
||||||
|
# Operational Procedures
|
||||||
|
## Accessing the Application
|
||||||
|
|
||||||
|
Local Development:
|
||||||
|
minikube service web-app-service -n web-app
|
||||||
|
|
||||||
|
Production Access:
|
||||||
|
http://<node-ip>:30080
|
||||||
|
|
||||||
|
Monitoring Commands:
|
||||||
|
# Check pod status
|
||||||
|
kubectl get pods -n web-app -w
|
||||||
|
|
||||||
|
# View frontend logs
|
||||||
|
kubectl logs -n web_app deploy/web-app -f
|
||||||
|
|
||||||
|
# Verify database health
|
||||||
|
kubectl exec -n web-app mysql-0 -- mysql -uroot -ppassword -e "SHOW DATABASES;"
|
||||||
|
|
||||||
|
# Maintenance Tasks
|
||||||
|
Scaling Frontend:
|
||||||
|
kubectl scale -n web-app deployment/web-app --replicas=3
|
||||||
|
|
||||||
|
Database Backup:
|
||||||
|
kubectl exec -n web-app mysql-0 -- \
|
||||||
|
mysqldump -u root -ppassword taskmanager > backup_$(date +%F).sql
|
||||||
|
|
||||||
|
# Security Notes
|
||||||
|
Database Credentials:
|
||||||
|
|
||||||
|
Default credentials are for demonstration only
|
||||||
|
|
||||||
|
In production, use:
|
||||||
|
envFrom:
|
||||||
|
- secretRef:
|
||||||
|
name: mysql-credentials
|
||||||
|
|
||||||
|
Network Exposure:
|
||||||
|
Current: NodePort (30080)
|
||||||
|
Recommended: Ingress with TLS termination
|
||||||
|
|
||||||
|
# Troubleshooting Guide
|
||||||
|
Symptom Diagnostic Steps Resolution
|
||||||
|
Frontend not responding kubectl get svc -n web-app Verify NodePort configuration
|
||||||
|
Database pod crash loops kubectl describe pod mysql-0 -n web-app Check storage permissions
|
||||||
|
High CPU usage kubectl top pods -n web-app Adjust resource limits
|
||||||
|
|
||||||
|
Cleanup Procedure
|
||||||
|
# Full uninstall
|
||||||
|
./stop-app.sh
|
||||||
|
|
||||||
|
# Optional: Remove persistent data
|
||||||
|
sudo rm -rf /mnt/data/mysql
|
45
z2/deployment.yaml
Normal file
45
z2/deployment.yaml
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
apiVersion: apps/v1
|
||||||
|
kind: Deployment
|
||||||
|
metadata:
|
||||||
|
name: web-app
|
||||||
|
namespace: web-app
|
||||||
|
labels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: frontend
|
||||||
|
spec:
|
||||||
|
replicas: 2
|
||||||
|
selector:
|
||||||
|
matchLabels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: frontend
|
||||||
|
template:
|
||||||
|
metadata:
|
||||||
|
labels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: frontend
|
||||||
|
spec:
|
||||||
|
containers:
|
||||||
|
- name: web-app
|
||||||
|
image: k8s-task-manager-frontend:latest
|
||||||
|
imagePullPolicy: IfNotPresent
|
||||||
|
ports:
|
||||||
|
- containerPort: 80
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
cpu: "100m"
|
||||||
|
memory: "128Mi"
|
||||||
|
limits:
|
||||||
|
cpu: "250m"
|
||||||
|
memory: "256Mi"
|
||||||
|
livenessProbe:
|
||||||
|
httpGet:
|
||||||
|
path: /
|
||||||
|
port: 80
|
||||||
|
initialDelaySeconds: 5
|
||||||
|
periodSeconds: 10
|
||||||
|
readinessProbe:
|
||||||
|
httpGet:
|
||||||
|
path: /
|
||||||
|
port: 80
|
||||||
|
initialDelaySeconds: 5
|
||||||
|
periodSeconds: 10
|
375
z2/index.html
Normal file
375
z2/index.html
Normal file
@ -0,0 +1,375 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>K8s Task Manager</title>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--primary: #4a6fa5;
|
||||||
|
--secondary: #166088;
|
||||||
|
--accent: #4fc3f7;
|
||||||
|
--background: #f5f7fa;
|
||||||
|
--text: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Roboto', sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background-color: var(--background);
|
||||||
|
color: var(--text);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
background: linear-gradient(135deg, var(--primary), var(--secondary));
|
||||||
|
color: white;
|
||||||
|
padding: 2rem 0;
|
||||||
|
text-align: center;
|
||||||
|
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 2.5rem;
|
||||||
|
animation: fadeIn 1s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-weight: 300;
|
||||||
|
opacity: 0.9;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
background: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
|
||||||
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0 8px 16px rgba(0,0,0,0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card h2 {
|
||||||
|
color: var(--primary);
|
||||||
|
margin-top: 0;
|
||||||
|
border-bottom: 2px solid var(--accent);
|
||||||
|
padding-bottom: 0.5rem;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 1.8rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-label {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.task-list {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 1rem 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.task-item {
|
||||||
|
padding: 0.8rem;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
background: rgba(74, 111, 165, 0.05);
|
||||||
|
border-left: 3px solid var(--accent);
|
||||||
|
border-radius: 4px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.task-item:hover {
|
||||||
|
background: rgba(74, 111, 165, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.task-actions button {
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
color: var(--primary);
|
||||||
|
cursor: pointer;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
transition: color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.task-actions button:hover {
|
||||||
|
color: var(--secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-task {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-task input {
|
||||||
|
flex-grow: 1;
|
||||||
|
padding: 0.8rem;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-radius: 4px 0 0 4px;
|
||||||
|
font-size: 1rem;
|
||||||
|
outline: none;
|
||||||
|
transition: border 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-task input:focus {
|
||||||
|
border-color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-task button {
|
||||||
|
background-color: var(--primary);
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
padding: 0 1.5rem;
|
||||||
|
border-radius: 0 4px 4px 0;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-task button:hover {
|
||||||
|
background-color: var(--secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-toggle {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2rem;
|
||||||
|
right: 2rem;
|
||||||
|
background: var(--primary);
|
||||||
|
color: white;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
box-shadow: 0 2px 10px rgba(0,0,0,0.2);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-toggle:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
background: var(--secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 3rem;
|
||||||
|
padding: 1rem;
|
||||||
|
color: #666;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from { opacity: 0; transform: translateY(-20px); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
|
||||||
|
body.dark {
|
||||||
|
--background: #1a1a2e;
|
||||||
|
--text: #f1f1f1;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.dark .card {
|
||||||
|
background: #16213e;
|
||||||
|
color: #f1f1f1;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.dark .task-item {
|
||||||
|
background: rgba(74, 111, 165, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
body.dark footer {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<div class="container">
|
||||||
|
<h1>Kubernetes Task Manager</h1>
|
||||||
|
<p class="subtitle">Manage your cluster tasks efficiently</p>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<div class="dashboard">
|
||||||
|
<div class="card">
|
||||||
|
<h2>Cluster Overview</h2>
|
||||||
|
<div class="stats">
|
||||||
|
<div class="stat-item">
|
||||||
|
<div class="stat-value" id="node-count">3</div>
|
||||||
|
<div class="stat-label">Nodes</div>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<div class="stat-value" id="pod-count">12</div>
|
||||||
|
<div class="stat-label">Pods</div>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<div class="stat-value" id="service-count">5</div>
|
||||||
|
<div class="stat-label">Services</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card">
|
||||||
|
<h2>Recent Tasks</h2>
|
||||||
|
<ul class="task-list" id="task-list">
|
||||||
|
<li class="task-item">
|
||||||
|
<span>Deploy new frontend version</span>
|
||||||
|
<div class="task-actions">
|
||||||
|
<button title="Complete">✓</button>
|
||||||
|
<button title="Delete">✕</button>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="task-item">
|
||||||
|
<span>Scale database pods</span>
|
||||||
|
<div class="task-actions">
|
||||||
|
<button title="Complete">✓</button>
|
||||||
|
<button title="Delete">✕</button>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="task-item">
|
||||||
|
<span>Update ingress configuration</span>
|
||||||
|
<div class="task-actions">
|
||||||
|
<button title="Complete">✓</button>
|
||||||
|
<button title="Delete">✕</button>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div class="add-task">
|
||||||
|
<input type="text" id="new-task" placeholder="Add new task...">
|
||||||
|
<button id="add-task-btn">Add</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card">
|
||||||
|
<h2>Resource Usage</h2>
|
||||||
|
<div id="chart-container" style="height: 200px;">
|
||||||
|
<svg viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M0,200 L50,150 L100,170 L150,120 L200,160 L250,130 L300,180"
|
||||||
|
stroke="#4a6fa5" stroke-width="2" fill="none"/>
|
||||||
|
<path d="M0,200 L50,160 L100,140 L150,180 L200,150 L250,170 L300,130"
|
||||||
|
stroke="#4fc3f7" stroke-width="2" fill="none" stroke-dasharray="5,3"/>
|
||||||
|
<text x="10" y="30" fill="#4a6fa5">CPU</text>
|
||||||
|
<text x="10" y="50" fill="#4fc3f7">Memory</text>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>Kubernetes Web App | © 2025 | Deployed with ♥ using K8s</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<button class="theme-toggle" id="theme-toggle">🌓</button>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const taskList = document.getElementById('task-list');
|
||||||
|
const newTaskInput = document.getElementById('new-task');
|
||||||
|
const addTaskBtn = document.getElementById('add-task-btn');
|
||||||
|
const themeToggle = document.getElementById('theme-toggle');
|
||||||
|
|
||||||
|
addTaskBtn.addEventListener('click', function() {
|
||||||
|
const taskText = newTaskInput.value.trim();
|
||||||
|
if (taskText) {
|
||||||
|
const taskItem = document.createElement('li');
|
||||||
|
taskItem.className = 'task-item';
|
||||||
|
taskItem.innerHTML = `
|
||||||
|
<span>${Chan}</span>
|
||||||
|
<div class="task-actions">
|
||||||
|
<button title="Complete">✓</button>
|
||||||
|
<button title="Delete">✕</button>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
taskList.appendChild(taskItem);
|
||||||
|
newTaskInput.value = '';
|
||||||
|
|
||||||
|
taskItem.querySelectorAll('button')[0].addEventListener('click', completeTask);
|
||||||
|
taskItem.querySelectorAll('button')[1].addEventListener('click', deleteTask);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function completeTask(e) {
|
||||||
|
const taskItem = e.target.closest('.task-item');
|
||||||
|
taskItem.style.opacity = '0.5';
|
||||||
|
taskItem.style.textDecoration = 'line-through';
|
||||||
|
setTimeout(() => {
|
||||||
|
taskItem.remove();
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function deleteTask(e) {
|
||||||
|
const taskItem = e.target.closest('.task-item');
|
||||||
|
taskItem.style.transform = 'translateX(100%)';
|
||||||
|
taskItem.style.opacity = '0';
|
||||||
|
setTimeout(() => {
|
||||||
|
taskItem.remove();
|
||||||
|
}, 300);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelectorAll('.task-actions button:nth-child(1)').forEach(btn => {
|
||||||
|
btn.addEventListener('click', completeTask);
|
||||||
|
});
|
||||||
|
|
||||||
|
document.querySelectorAll('.task-actions button:nth-child(2)').forEach(btn => {
|
||||||
|
btn.addEventListener('click', deleteTask);
|
||||||
|
});
|
||||||
|
|
||||||
|
themeToggle.addEventListener('click', function() {
|
||||||
|
document.body.classList.toggle('dark');
|
||||||
|
localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light');
|
||||||
|
});
|
||||||
|
|
||||||
|
if (localStorage.getItem('theme') === 'dark') {
|
||||||
|
document.body.classList.add('dark');
|
||||||
|
}
|
||||||
|
|
||||||
|
setInterval(() => {
|
||||||
|
document.getElementById('pod-count').textContent =
|
||||||
|
Math.floor(10 + Math.random() * 5);
|
||||||
|
}, 3000);
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
6
z2/namespace.yaml
Normal file
6
z2/namespace.yaml
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: Namespace
|
||||||
|
metadata:
|
||||||
|
name: web-app
|
||||||
|
labels:
|
||||||
|
app: k8s-task-manager
|
18
z2/nginx.conf
Normal file
18
z2/nginx.conf
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
server_name localhost;
|
||||||
|
|
||||||
|
location / {
|
||||||
|
root /usr/share/nginx/html;
|
||||||
|
index index.html;
|
||||||
|
try_files $uri $uri/ /index.html;
|
||||||
|
}
|
||||||
|
|
||||||
|
gzip on;
|
||||||
|
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
|
||||||
|
|
||||||
|
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
|
||||||
|
expires 1y;
|
||||||
|
add_header Cache-Control "public, no-transform";
|
||||||
|
}
|
||||||
|
}
|
12
z2/package.json
Normal file
12
z2/package.json
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
{
|
||||||
|
"name": "k8s-task-manager-frontend",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Frontend for Kubernetes Task Manager",
|
||||||
|
"scripts": {
|
||||||
|
"build": "mkdir -p dist && cp index.html dist/",
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1"
|
||||||
|
},
|
||||||
|
"keywords": [],
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC"
|
||||||
|
}
|
16
z2/persistentvolume.yaml
Normal file
16
z2/persistentvolume.yaml
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: PersistentVolume
|
||||||
|
metadata:
|
||||||
|
name: mysql-pv
|
||||||
|
namespace: web-app
|
||||||
|
labels:
|
||||||
|
type: local
|
||||||
|
app: k8s-task-manager
|
||||||
|
spec:
|
||||||
|
storageClassName: manual
|
||||||
|
capacity:
|
||||||
|
storage: 5Gi
|
||||||
|
accessModes:
|
||||||
|
- ReadWriteOnce
|
||||||
|
hostPath:
|
||||||
|
path: "/mnt/data/mysql"
|
12
z2/prepare-app.sh
Executable file
12
z2/prepare-app.sh
Executable file
@ -0,0 +1,12 @@
|
|||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
sudo mkdir -p /mnt/data/mysql
|
||||||
|
sudo chmod 777 -R /mnt/data
|
||||||
|
|
||||||
|
docker build -t k8s-task-manager-frontend:latest -f Dockerfile .
|
||||||
|
|
||||||
|
if command -v minikube &> /dev/null; then
|
||||||
|
minikube image load k8s-task-manager-frontend:latest
|
||||||
|
fi
|
||||||
|
|
||||||
|
echo "Kubernetes application preparation complete!"
|
18
z2/service.yaml
Normal file
18
z2/service.yaml
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: Service
|
||||||
|
metadata:
|
||||||
|
name: web-app-service
|
||||||
|
namespace: web-app
|
||||||
|
labels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: frontend
|
||||||
|
spec:
|
||||||
|
type: NodePort
|
||||||
|
selector:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: frontend
|
||||||
|
ports:
|
||||||
|
- protocol: TCP
|
||||||
|
port: 80
|
||||||
|
targetPort: 80
|
||||||
|
nodePort: 30080
|
15
z2/start-app.sh
Executable file
15
z2/start-app.sh
Executable file
@ -0,0 +1,15 @@
|
|||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
kubectl apply -f namespace.yaml
|
||||||
|
|
||||||
|
kubectl apply -f persistentvolume.yaml
|
||||||
|
|
||||||
|
kubectl apply -f statefulset.yaml
|
||||||
|
|
||||||
|
kubectl wait --for=condition=ready pod -l app=mysql --timeout=120s -n web-app
|
||||||
|
|
||||||
|
./prepare-app.sh
|
||||||
|
kubectl apply -f deployment.yaml
|
||||||
|
kubectl apply -f service.yaml
|
||||||
|
|
||||||
|
echo "Application deployed to Kubernetes!"
|
50
z2/statefulset.yaml
Normal file
50
z2/statefulset.yaml
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
apiVersion: apps/v1
|
||||||
|
kind: StatefulSet
|
||||||
|
metadata:
|
||||||
|
name: mysql
|
||||||
|
namespace: web-app
|
||||||
|
labels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: database
|
||||||
|
spec:
|
||||||
|
serviceName: mysql
|
||||||
|
replicas: 1
|
||||||
|
selector:
|
||||||
|
matchLabels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: database
|
||||||
|
template:
|
||||||
|
metadata:
|
||||||
|
labels:
|
||||||
|
app: k8s-task-manager
|
||||||
|
tier: database
|
||||||
|
spec:
|
||||||
|
containers:
|
||||||
|
- name: mysql
|
||||||
|
image: mysql:5.7
|
||||||
|
env:
|
||||||
|
- name: MYSQL_ROOT_PASSWORD
|
||||||
|
value: "password"
|
||||||
|
- name: MYSQL_DATABASE
|
||||||
|
value: "taskmanager"
|
||||||
|
ports:
|
||||||
|
- containerPort: 3306
|
||||||
|
name: mysql
|
||||||
|
volumeMounts:
|
||||||
|
- name: mysql-persistent-storage
|
||||||
|
mountPath: /var/lib/mysql
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
cpu: "500m"
|
||||||
|
memory: "512Mi"
|
||||||
|
limits:
|
||||||
|
cpu: "1000m"
|
||||||
|
memory: "1Gi"
|
||||||
|
volumeClaimTemplates:
|
||||||
|
- metadata:
|
||||||
|
name: mysql-persistent-storage
|
||||||
|
spec:
|
||||||
|
accessModes: [ "ReadWriteOnce" ]
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
storage: 2Gi
|
11
z2/stop-app.sh
Executable file
11
z2/stop-app.sh
Executable file
@ -0,0 +1,11 @@
|
|||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
kubectl delete -f service.yaml
|
||||||
|
kubectl delete -f deployment.yaml
|
||||||
|
|
||||||
|
kubectl delete -f statefulset.yaml
|
||||||
|
kubectl delete -f persistentvolume.yaml
|
||||||
|
|
||||||
|
kubectl delete -f namespace.yaml
|
||||||
|
|
||||||
|
echo "Application removed from Kubernetes!"
|
Loading…
Reference in New Issue
Block a user