使用Docker的演示

1.1 任务说明

咱们来创建一个小型的多容器应用程序，逐步分析整个开发过程：从任务说明到展示最终产品。

目标：创建一个多容器任务管理应用，用户可以创建、编辑、删除任务，并将任务分配给其他用户。应用包含三个主要组件：基于 ReactJS 的前端、基于 Python (Flask) 的后端以及 PostgreSQL 数据库。

主要任务：

1. 定义每个应用组件的功能需求。
2. 选择使用的技术和工具。
3. 准备开发环境。

1.2 定义功能需求

任务管理应用的功能需求：

1. 用户的注册和登录：
   • 用户可以在系统中注册。
   • 用户可以登录系统。
2. 任务管理：
   • 用户可以创建任务。
   • 用户可以编辑任务。
   • 用户可以删除任务。
   • 用户可以查看任务列表。
   • 用户可以将任务分配给其他用户。
3. 查看和过滤任务：
   • 用户可以根据状态筛选任务(已完成/未完成)。
   • 用户可以查看分配给其他用户的任务。

1.3 使用的技术和工具的定义

为了实现该应用程序，将使用以下技术和工具：

1. Frontend:
   • ReactJS: 用于创建用户界面的库。
   • Axios: 用于执行 HTTP 请求的库。
2. Backend:
   • Python: 用于创建服务器端的编程语言。
   • Flask: 用于创建 REST API 的 Web 框架。
   • SQLAlchemy: 用于与数据库交互的 ORM。
3. Database:
   • PostgreSQL: 用于存储用户和任务信息的关系型数据库。
4. 容器化和编排:
   • Docker: 应用程序容器化的平台。
   • Docker Compose: 用于管理多容器应用程序的工具。

1.4 开发环境准备

为了成功完成项目，需要配置开发环境并确保所需的工具已安装。

准备环境的步骤：

1. 安装 Docker：
   • 如果你还没安装，回到第一层级第 4 讲，或者按照 Docker 官方网站的说明操作。
2. 安装 Docker Compose：
   • 如果 Docker Compose 还没安装，请参考第 4 层级第 2 讲，或者按照 Docker Compose 官方网站的说明操作。
3. 创建项目结构：
   • 创建项目目录以及每个服务的主要子目录：

mkdir task_management_app
cd task_management_app
mkdir frontend backend database
        

1. 初始化项目：
   • 在 frontend 目录中初始化一个新的 ReactJS 项目：

cd frontend
npx create-react-app .
cd ..
        

• 在 backend 目录中创建一个 Python/Flask 应用的结构：

cd backend
mkdir app
touch app/__init__.py
touch app/models.py
touch app/routes.py
touch run.py
touch requirements.txt
cd ..
        

• 在 database 目录中创建一个 PostgreSQL 的 Dockerfile（如有必要）：

cd database
touch Dockerfile
cd ..
        

1.5 文件内容示例：

文件 backend/app/__init__.py:

from flask import Flask
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'postgresql://taskuser:taskpassword@database:5432/taskdb'
db = SQLAlchemy(app)

from app import routes
    

文件 backend/app/models.py:

from app import db

class User(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    username = db.Column(db.String(80), unique=True, nullable=False)
    tasks = db.relationship('Task', backref='owner', lazy=True)

class Task(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String(120), nullable=False)
    description = db.Column(db.Text, nullable=True)
    owner_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
    

文件 backend/app/routes.py:

from app import app

@app.route('/')
def index():
    return "你好, 任务管理应用程序!"
    

文件 backend/run.py:

from app import app

if __name__ == '__main__':
    app.run(host='0.0.0.0')
    

文件 backend/requirements.txt:

Flask
Flask-SQLAlchemy
psycopg2-binary