基于 Python + Flask + Tailwind 快速搭建个人博客
技术选型理由
在开发个人网站或小型 Web 项目时，前后端高度耦合的模式往往不够优雅。本教程采用 Python 微框架 Flask 配合前端原子化 CSS 框架 Tailwind CSS。该组合开发体验流畅，适合构建轻量级、高颜值的博客系统。
一、技术栈解析
核心诉求：轻量、美观、无需手写 SQL、简化 CSS 编写。
- 后端引擎：Flask。小巧灵活，路由机制直观，适合轻量级应用。
- 数据库：SQLite + SQLAlchemy。本地文件集成，使用 ORM 操作数据，避免 SQL 拼接。
- 前端 UI：Tailwind CSS (CDN)。原子化 CSS 框架，直接在 HTML 类名中实现现代响应式布局。
二、环境搭建
新建项目文件夹，建议使用 Python 虚拟环境隔离依赖：
# 创建并激活虚拟环境 (Windows)
python -m venv .venv
.venv\Scripts\activate
# 安装核心依赖包
pip install Flask Flask-SQLAlchemy
三、核心代码实现
整个项目仅需 1 个 Python 后端文件和 4 个 HTML 前端模板。项目结构如下：
flask_blog/
├── app.py # 后端核心逻辑与数据库模型
└── templates/ # HTML 模板文件夹
├── base.html # 全局基础母版（包含导航栏）
├── index.html # 首页（文章列表展示）
├── post.html # 文章详情页
└── create.html # 发布文章页
1. 后端核心：app.py
定义文章数据库模型，实现首页展示、文章详情和发布文章的三个核心路由。首次运行会自动创建 blog.db 数据库。
from flask import Flask, render_template, request, redirect, url_for, flash
from flask_sqlalchemy import SQLAlchemy
datetime datetime
app = Flask(__name__)
app.config[] =
app.config[] =
app.config[] =
db = SQLAlchemy(app)
(db.Model):
= db.Column(db.Integer, primary_key=)
title = db.Column(db.String(), nullable=)
content = db.Column(db.Text, nullable=)
created_at = db.Column(db.DateTime, default=datetime.now)
app.app_context():
db.create_all()
():
articles = Article.query.order_by(Article.created_at.desc()).()
render_template(, articles=articles)
():
article = Article.query.get_or_404(article_id)
render_template(, article=article)
():
request.method == :
title = request.form[]
content = request.form[]
title content:
flash()
:
new_article = Article(title=title, content=content)
db.session.add(new_article)
db.session.commit()
redirect(url_for())
render_template()
__name__ == :
app.run(debug=)
