171 lines
4.8 KiB
Markdown
171 lines
4.8 KiB
Markdown
# Weather Web App - Kubernetes Deployment
|
|
|
|
This project deploys a full-stack weather web application to Kubernetes. It includes:
|
|
- A frontend website to search weather by city
|
|
- A backend PostgreSQL database for logging searches
|
|
- A Node.js API to connect the frontend to the database
|
|
|
|
---
|
|
|
|
## Application Description
|
|
|
|
- **Frontend (weather.html):** A responsive, modern web UI that shows current weather data using the OpenWeatherMap API.
|
|
- **Backend (PostgreSQL):** Stores weather search history via a `weather_log` table.
|
|
- **API Server (Node.js):** Receives weather data from the frontend and logs it to the PostgreSQL database.
|
|
|
|
---
|
|
|
|
## Containers Used
|
|
|
|
| Container | Image | Description |
|
|
|------------------|--------------------|----------------------------------------------|
|
|
| `weather-frontend` | Custom Nginx-based | Serves the `weather.html` UI |
|
|
| `postgres` | `postgres:15` | Provides relational database backend |
|
|
| `weather-api` | Custom Node.js | API that logs weather data to PostgreSQL |
|
|
|
|
---
|
|
|
|
## ☸️ Kubernetes Objects
|
|
|
|
| Object Type | File | Description |
|
|
|------------------------|------------------------|----------------------------------------------------------------------|
|
|
| `Namespace` | (inside script) | Isolates resources under `webapp-ns` |
|
|
| `Deployment` | `deployment.yaml` | Manages frontend app |
|
|
| `Deployment` | `deployment-api.yaml` | Manages the Node.js API |
|
|
| `StatefulSet` | `statefulset.yaml` | Manages PostgreSQL instance with persistent volume |
|
|
| `PersistentVolume` | `statefulset.yaml` | Host-mounted volume for PostgreSQL data |
|
|
| `PersistentVolumeClaim`| `statefulset.yaml` | Requests storage for StatefulSet |
|
|
| `Service` | `service.yaml` | Exposes frontend via NodePort |
|
|
| `Service` | `deployment-api.yaml` | Exposes API via NodePort |
|
|
| `Service` | `postgres-service.yaml`| Internal ClusterIP service for PostgreSQL DNS resolution |
|
|
| `ConfigMap` | `db-init-script` | Stores the SQL init script for table creation |
|
|
|
|
---
|
|
|
|
## Networking & Volumes
|
|
|
|
### Virtual Networks:
|
|
- Kubernetes services provide internal DNS for `postgres` and `weather-api-service`.
|
|
- Frontend and API exposed externally using `NodePort` services.
|
|
|
|
### Volumes:
|
|
- `PersistentVolume` and `PersistentVolumeClaim` ensure PostgreSQL data is retained.
|
|
- `ConfigMap` used to apply `init-db.sql` manually via `psql`.
|
|
|
|
---
|
|
|
|
## ⚙️ Container Configurations
|
|
|
|
### Frontend
|
|
- Dockerfile uses `nginx:alpine`
|
|
- Serves `weather.html`
|
|
- Exposed on port `80`
|
|
|
|
### Node.js API
|
|
- Built with Node.js 18
|
|
- Listens on port `3000`
|
|
- Connects to PostgreSQL using service DNS `postgres`
|
|
- Accepts POST requests at `/log`
|
|
|
|
### PostgreSQL
|
|
- `postgres:15` with `weatheruser`, `weatherpass`, and `weatherdb`
|
|
- Table `weather_log` is created manually after StatefulSet starts
|
|
|
|
---
|
|
|
|
## How to Use the Application
|
|
|
|
### 1. Build Docker Images
|
|
|
|
```bash
|
|
./prepare-app.sh
|
|
```
|
|
|
|
### 2. Start the App (create namespace and apply all configs)
|
|
|
|
```bash
|
|
./start-app.sh
|
|
```
|
|
|
|
### 3. Manually Initialize the Database
|
|
|
|
```bash
|
|
kubectl exec -it -n webapp-ns statefulset/postgres -- psql -U weatheruser -d weatherdb
|
|
```
|
|
|
|
Paste this inside the prompt:
|
|
|
|
```sql
|
|
CREATE TABLE IF NOT EXISTS weather_log (
|
|
id SERIAL PRIMARY KEY,
|
|
city VARCHAR(100),
|
|
temperature DECIMAL(5,2),
|
|
description TEXT,
|
|
timestamp TIMESTAMP DEFAULT CURRENT_TIMESTAMP
|
|
);
|
|
```
|
|
|
|
Exit with:
|
|
```sql
|
|
\q
|
|
```
|
|
|
|
### 4. View the App
|
|
|
|
```bash
|
|
minikube service weather-service -n webapp-ns
|
|
```
|
|
|
|
Or manually:
|
|
|
|
```bash
|
|
minikube ip
|
|
kubectl get svc -n webapp-ns
|
|
```
|
|
Then open:
|
|
```
|
|
http://<minikube-ip>:<frontend-nodeport>
|
|
```
|
|
|
|
### 5. Use the App
|
|
- Search for a city
|
|
- Weather appears
|
|
- Weather data is logged via API to PostgreSQL
|
|
|
|
### 6. View Logged Data
|
|
|
|
```bash
|
|
kubectl exec -it -n webapp-ns statefulset/postgres -- psql -U weatheruser -d weatherdb
|
|
```
|
|
|
|
```sql
|
|
SELECT * FROM weather_log ORDER BY timestamp DESC;
|
|
```
|
|
|
|
### 7. Stop and Clean Up
|
|
|
|
```bash
|
|
./stop-app.sh
|
|
```
|
|
|
|
---
|
|
|
|
## API Key Setup
|
|
|
|
- Register at [OpenWeatherMap](https://openweathermap.org/api)
|
|
- Replace the key in `weather.html`:
|
|
|
|
```js
|
|
const apiKey = "YOUR_API_KEY";
|
|
```
|
|
|
|
---
|
|
|
|
## Conclusion
|
|
|
|
- Frontend fetches real-time weather from OpenWeatherMap
|
|
- Logs are POSTed to backend and stored in PostgreSQL
|
|
|
|
---
|
|
|