├── .env
├── Dockerfile
├── README.md
├── app.py
├── docker-compose.yml
├── initial-table-create.sql
├── requirements.txt
└── templates
    └── index.html


/.env:
--------------------------------------------------------------------------------
1 | MYSQL_HOST = mysql_db 
2 | MYSQL_USER = admin
3 | MYSQL_PASSWORD = admin123
4 | MYSQL_DB = twotier
5 | MYSQL_ROOT_PASSWORD = root123
6 | 


--------------------------------------------------------------------------------
/Dockerfile:
--------------------------------------------------------------------------------
 1 | # Use an official Python runtime as the base image
 2 | FROM python:3.9-slim
 3 | 
 4 | # Set the working directory in the container
 5 | WORKDIR /app
 6 | 
 7 | # install required packages for system
 8 | RUN apt-get update \
 9 |     && apt-get upgrade -y \
10 |     && apt-get install -y gcc default-libmysqlclient-dev pkg-config \
11 |     && rm -rf /var/lib/apt/lists/*
12 | 
13 | 
14 | # Copy the requirements file into the container
15 | COPY requirements.txt .
16 | 
17 | 
18 | # Install app dependencies
19 | RUN pip install --upgrade pip \
20 |     && pip install mysqlclient \
21 |     && pip install --no-cache-dir -r requirements.txt
22 | 
23 | 
24 | # Copy the rest of the application code
25 | COPY . .
26 | 
27 | 
28 | # Specify the command to run your application
29 | CMD ["python", "app.py"]
30 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | This is a simple Flask app that interacts with a MySQL database. The app allows users to submit messages, which are then stored in the database and displayed on the frontend.
2 | 


--------------------------------------------------------------------------------
/app.py:
--------------------------------------------------------------------------------
 1 | import os
 2 | from flask import Flask, render_template, request, redirect, url_for
 3 | from flask_mysqldb import MySQL
 4 | from urllib.parse import quote
 5 | 
 6 | app = Flask(__name__)
 7 | 
 8 | #Configure MYSQL from environment variables
 9 | app.config['MYSQL_HOST']=os.environ.get('MYSQL_HOST')
10 | app.config['MYSQL_USER']=os.environ.get('MYSQL_USER')
11 | app.config['MYSQL_PASSWORD']=os.environ.get('MYSQL_PASSWORD')
12 | app.config['MYSQL_DB']=os.environ.get('MYSQL_DB')
13 | 
14 | #Initialize MYSQL
15 | mysql = MySQL(app)
16 | 
17 | @app.route('/')
18 | def hello():
19 |     cur = mysql.connection.cursor()
20 |     cur.execute('SELECT message FROM messages')
21 |     messages = cur.fetchall()
22 |     cur.close()
23 |     return render_template('index.html', messages=messages)
24 | 
25 | @app.route('/submit', methods=['POST'])
26 | def submit():
27 |     new_message = request.form.get('new_message')
28 |     cur = mysql.connection.cursor()
29 |     cur.execute('INSERT INTO messages (message) VALUES (%s)', [new_message])
30 |     mysql.connection.commit()
31 |     cur.close()
32 |     return redirect(url_for('hello'))
33 | 
34 | if __name__ == '__main__':
35 |     app.run(host='0.0.0.0', port=5000, debug=True)
36 | 
37 | 


--------------------------------------------------------------------------------
/docker-compose.yml:
--------------------------------------------------------------------------------
 1 | version: '3'
 2 | 
 3 | 
 4 | services:
 5 | 
 6 |   web:
 7 |     build:
 8 |       context: .
 9 |     ports:
10 |       - "5000:5000"
11 |     volumes:
12 |       - .:/app    
13 |     env_file:
14 |       - .env 
15 |     depends_on:
16 |       - mysql_db
17 | 
18 | 
19 |   mysql_db:
20 |     image: mysql
21 |     ports:
22 |       - "3306:3306"
23 | 
24 |     environment:
25 |       MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD}
26 |       MYSQL_DATABASE: ${MYSQL_DB}
27 |       MYSQL_USER: ${MYSQL_USER}
28 |       MYSQL_PASSWORD: ${MYSQL_PASSWORD}
29 | 
30 |     volumes: # Mount sql script into container's /docker-entrypoint-initdb.d directory to get table automatically created
31 |       - ./initial-table-create.sql:/docker-entrypoint-initdb.d/initial-table-create.sql
32 |     # Remove the volume used for storing MySQL data This will ensure that the data is erased when containers are taken down
33 |     # Note: This will erase all MySQL data, including the messages column data Only use this if you want to start with a clean database every time        
34 |       - mysql-data:/var/lib/mysql  # Mount the volume for MySQL data storage
35 | 
36 | volumes:
37 |   mysql-data:
38 | 
39 |  
40 | 
41 | 


--------------------------------------------------------------------------------
/initial-table-create.sql:
--------------------------------------------------------------------------------
1 | CREATE TABLE messages (
2 |     id INT AUTO_INCREMENT PRIMARY KEY,
3 |     message TEXT
4 | );
5 | 


--------------------------------------------------------------------------------
/requirements.txt:
--------------------------------------------------------------------------------
1 | Flask
2 | Flask-MySQLdb
3 | requests
4 | urllib3
5 | 


--------------------------------------------------------------------------------
/templates/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 | 	<head>
 3 | 		<title>Flask App</title>
 4 | 		<style>
 5 |                 /* ...(your CSS styles) */
 6 |                </style>
 7 | 	</head>
 8 | 	<body>
 9 | 		<div class="container">
10 | 			<h1>Two Tier Flask MYSQL App with Docker Compose :)</h1>
11 | 			{% for message in messages %}
12 | 				<p>{{ message[0] }}</p>
13 | 			{% endfor %}
14 | 
15 | 			<form action="/submit" method="post">
16 | 				<input type="text" name="new_message" placeholder="Enter a message">
17 | 				<input type="submit" value="Submit">
18 | 			</form>
19 | 		</div>
20 | 
21 | 	</body>
22 | </html>
23 | 


--------------------------------------------------------------------------------