ma302dx/zkt25
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first assinement submition

Browse Source
This commit is contained in:
Muhammed Tariq Ali Razvi 2025-03-04 09:34:28 +01:00
commit cc44699bcf
10 changed files with 144 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
z1/README.md Normal file
View File

@ -0,0 +1,40 @@
# Visitor Counter Application
This project demonstrates a simple web application using Apache (web server), Flask (backend) and Redis(database), deployed with Docker Compose.
## Prerequisites
- Docker Engine v20.10 or newer.
- Docker Compose v2.33.1 or newer.
## Application Description
The application consists of two services:
1. Web server (Apache) serving an HTML page.
2. Backend (flask): Handles requests to '/counter'.
2. Database (Redis) storing visitor counts persistently.
## Instructions
1. Prepare the application:
./prepare-app.sh
2. Start the application:
./start-app.sh
3. Access the application at:
http://localhost:5000
or
run "hostname -I " and copy the ip address and Access the application at :
http://[ip address you copied]:5000
4. Stop the application:
./stop-app.sh
5. Remove all resources:
./remove-app.sh
## Virtual netwok and volumes
- A default network is created by docker compose for communication between these services
- A named volum ('redis_data') ensures Redis data persists across restarts.

11
z1/backend/Dockerfile Normal file
View File

@ -0,0 +1,11 @@
FROM python:3.9-slim
WORKDIR /app
COPY app.py /app/
RUN pip install flask redis
EXPOSE 5000
CMD ["python", "app.py"]

16
z1/backend/app.py Normal file
View File

@ -0,0 +1,16 @@
from flask import Flask, jsonify
import redis
app = Flask(__name__)
# Connect to Redis (running in a separate container)
redis_client = redis.StrictRedis(host='redis', port=6379, decode_responses=True)
@app.route('/counter', methods=['GET'])
def counter():
# Increment visitor count in Redis
visits = redis_client.incr('visits')
return jsonify({"visits": visits})
if __name__ == '__main__':
app.run(host='0.0.0.0', port=5000)

28
z1/compose.yaml Normal file
View File

@ -0,0 +1,28 @@
version: '3.8'
services:
web:
build: ./web
ports:
- "5000:80"
depends_on:
- backend
restart: always
backend:
build: ./backend
ports:
- "5001:5000"
depends_on:
- redis
restart: always
redis:
image: redis:alpine
command: ["redis-server", "--appendonly", "yes"]
volumes:
- redis_data:/data
restart: always
volumes:
redis_data:

3
z1/prepare-app.sh Executable file
View File

@ -0,0 +1,3 @@
#!/bin/bash
echo "Preparing app..."
docker compose build

3
z1/remove-app.sh Executable file
View File

@ -0,0 +1,3 @@
#!/bin/bash
echo "Removing app..."
docker compose down -v --remove-orphans

6
z1/start-app.sh Executable file
View File

@ -0,0 +1,6 @@
#!/bin/bash
echo "Starting app..."
docker compose up -d
echo "The app is available at http://localhost:5000"
echo "You can also open in windows by running hostname -I in linux and copying the ip address "
echo "Then you can open you main OS broswer and type http://[ip you copied]:5000"

3
z1/stop-app.sh Executable file
View File

@ -0,0 +1,3 @@
#!/bin/bash
echo "Stopping app..."
docker compose stop

6
z1/web/Dockerfile Normal file
View File

@ -0,0 +1,6 @@
FROM httpd:2.4
# Copies your static HTML file into the Apache document root
COPY index.html /usr/local/apache2/htdocs/
EXPOSE 80

28
z1/web/index.html Normal file
View File

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Visitor Counter</title>
</head>
<body>
<h1>Welcome to the Visitor Counter App!</h1>
<h2>Made by ALI</h2>
<h3>Also made for assinment 1</h3>
<p>This page has been visited <span id="counter">0</span> times.</p>
<script>
async function updateCounter() {
try {
const response = await fetch('http://localhost:5001/counter');
const data = await response.json();
document.getElementById('counter').textContent = data.visits;
} catch (error) {
console.error('Error fetching counter:', error);
}
}
updateCounter();
</script>
</body>
</html>