# SYS265 - Mini Docker Project flask web-chat app with docker ___ >[!Note] > I've been learning some network programming lately, so most of the python is my own. but I did use AI for the Dockerfile, some of the javascript, and general troubleshooting (netwoking in a Docker container can get confusing) ## Project Structure ``` ├── docker-chat │   ├── app │   │   ├── app.py │   │   ├── requirements.txt │   │   └── templates │   │   └── index.html │   ├── docker-compose.yml │   └── Dockerfile ``` ___ ## 1. create [app.py](https://git.charlotte.sh/lotte/ChamplainTechJournals/src/branch/main/sysadmin-ii-sys265/docker_proj1/app/app.py) this is the python/flask backend for the web app. it will open a websocket on port 5000 and handle message sent over it. ``` from flask import Flask, render_template from flask_socketio import SocketIO, send # initialize flask and socketio app = Flask(__name__) socketio = SocketIO(app) # default page @app.route('/') def index(): return render_template('index.html') # runs when message is received on socket @socketio.on('message') def handle_message(msg): print("message: " + msg) send(msg, broadcast=True) # open websocket, listen on port 5000 if __name__ == '__main__': socketio.run(app, host='0.0.0.0', port=5000, allow_unsafe_werkzeug=True) ``` ## 2. create [index.html](https://git.charlotte.sh/lotte/ChamplainTechJournals/src/branch/main/sysadmin-ii-sys265/docker_proj1/app/templates/index.html) this is the html frontend for the web page, as well as some javascript to be a medium between network connections and the frontend webpage ``` sys265 chat ``` ## 3. create [requirements.txt](https://git.charlotte.sh/lotte/ChamplainTechJournals/src/branch/main/sysadmin-ii-sys265/docker_proj1/app/requirements.txt) this includes necessary dependencies. they will be installed via Dockerfile ``` Flask==2.2.2 flask-socketio==5.3.2 werkzeug==2.2.2 ``` ## 4. create [docker-compose.yml](https://git.charlotte.sh/lotte/ChamplainTechJournals/src/branch/main/sysadmin-ii-sys265/docker_proj1/docker-compose.yml) this defines the services to be used. while this could work without the chat-net network, creating an isolated network made setting this up simpley imo, especially since we are already running wordpress. ``` version: '3.8' services: chat-server: build: . ports: - "5000:5000" volumes: - ./app:/app networks: - chat-net networks: chat-net: driver: bridge ``` ## 5. create [Dockerfile](https://git.charlotte.sh/lotte/ChamplainTechJournals/src/branch/main/sysadmin-ii-sys265/docker_proj1/Dockerfile) ``` # use this version of python FROM python:3.12-slim # create a working directory and copy requirements file to it WORKDIR /app COPY app/requirements.txt /app/requirements.txt # install dependencies RUN pip install --no-cache-dir -r requirements.txt # copy the rest of the files to working directory COPY app /app # run the python script when the container starts CMD ["python", "app.py"] ``` ## 6. run docker-compose ``` cd docker-chat docker-compose up -d ``` ![image](../../assets/5e739863-3710-4ea0-8988-2a9c56ddb981.png)