xia仔ke：chaoxingit.com/4964/

Python Flask 全流程全栈项目实战

引言

随着互联网应用的快速发展，Web 开发变得越来越重要。Python 作为一种易于上手且功能强大的编程语言，在 Web 开发领域中有着广泛的应用。Flask 是一个轻量级的 Web 应用框架，非常适合用来快速构建中小型网站或 API 服务。本文将引导你完成一个基于 Flask 的全栈 Web 应用项目，涵盖从环境搭建到部署的全过程。

环境准备

安装 Python
下载并安装最新版本的 Python。
确认 Python 和 pip 已经正确安装：
bash
深色版本

python --version

pip --version

创建虚拟环境

创建一个新的虚拟环境：
bash
深色版本

python -m venv myenv

source myenv/bin/activate

安装 Flask

使用 pip 安装 Flask：
bash
深色版本

pip install flask

项目结构

创建一个基本的项目目录结构：

深色版本

myproject/

├── app.py

├── static/

│   ├── css/

│   │   └── style.css

│   └── js/

│       └── main.js

└── templates/

    ├── base.html

    └── index.html

app.py：应用程序的主文件。
static/：存放静态文件，如 CSS 和 JavaScript 文件。
templates/：存放 HTML 模板文件。

创建 Flask 应用

编写基本的 Flask 应用
在 app.py 中编写如下代码：
python
深色版本

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')

def home():

    return render_template('index.html')

if __name__ == '__main__':

app.run(debug=True)

创建模板文件

在 templates/index.html 中编写如下代码：

html

深色版本

    Flask App

    Welcome to Flask App

添加静态文件

在 static/css/style.css 中添加样式：

css

深色版本

body {

    font-family: Arial, sans-serif;

    background-color: #f0f0f0;

h1 {

    color: #333;

在 static/js/main.js 中添加 JavaScript 代码：

javascript

深色版本

console.log("Hello from JavaScript!");

运行 Flask 应用

启动应用
在命令行中运行 Flask 应用：
bash
深色版本

python app.py
访问应用
打开浏览器，输入 http://127.0.0.1:5000/。

添加动态内容

修改 app.py
添加动态路由和视图函数：
python
深色版本

from flask import request

@app.route('/hello/')

def hello(name):

    return f'Hello, {name}!'

@app.route('/form')

def form():

    return render_template('form.html')

@app.route('/submit', methods=['POST'])

def submit():

    name = request.form['name']

return f'Thanks, {name}!'

创建表单页面

在 templates/form.html 中添加表单：
html
深色版本

{% extends "base.html" %}

{% block content %}

  Submit your name

{% endblock %}

数据持久化

安装 SQLite
使用 pip 安装 SQLite：
bash
深色版本

pip install flask-sqlalchemy

配置数据库

在 app.py 中添加数据库配置：
python
深色版本

from flask_sqlalchemy import SQLAlchemy

app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///site.db'

db = SQLAlchemy(app)

class User(db.Model):

    id = db.Column(db.Integer, primary_key=True)

    username = db.Column(db.String(20), unique=True, nullable=False)

    def __repr__(self):

return f"User('{self.username}')"

创建数据库表

初始化数据库：
bash
深色版本

python

from app import db

db.create_all()

添加用户

在 app.py 中添加用户注册功能：
python
深色版本

@app.route('/register', methods=['GET', 'POST'])

def register():

    if request.method == 'POST':

        username = request.form['username']

        user = User(username=username)

        db.session.add(user)

        db.session.commit()

        return f'Registered as {username}!'

return render_template('register.html')

创建注册页面

在 templates/register.html 中添加注册表单：
html
深色版本

{% extends "base.html" %}

{% block content %}

  Register

{% endblock %}

部署应用

选择部署平台
可以选择 Heroku、AWS、Google Cloud Platform 等云服务提供商。
容器化应用
使用 Docker 构建容器镜像：
dockerfile
深色版本

FROM python:3.9-slim-buster

WORKDIR /app

COPY requirements.txt .

RUN pip install -r requirements.txt

COPY . .

CMD ["python", "app.py"]

创建 requirements.txt 文件

列出所有依赖包：
txt
深色版本

Flask==2.0.2

Flask-SQLAlchemy==2.5.1

部署到 Heroku

安装 Heroku CLI 并登录账户。
创建 Heroku 应用：
bash
深色版本

heroku create

配置应用：

bash

深色版本

git init

git add .

git commit -m "Initial commit"

git push heroku master

查看应用状态

查看部署状态：
bash
深色版本

heroku logs --tail

访问部署后的应用

获取应用 URL：
bash
深色版本

heroku open

结语

本教程通过一个完整的 Flask 应用实例，介绍了如何从零开始构建一个具有动态内容和数据持久化功能的 Web 应用，并最终将其部署到云端。这只是一个简单的起点，你可以在此基础上添加更多功能，如用户认证、API 接口等。希望这个实战项目能够帮助你更好地理解和掌握 Flask Web 开发。