博客技术栈全览：Nuxt 3 + FastAPI + SQLite

技术栈概览

本博客采用 Nuxt.js 3 (SSR) + FastAPI + SQLite 的全栈架构。三个核心决策驱动了这个选型：SEO 友好、开发效率优先、运维成本最低。

前端：Nuxt 3 + Tailwind CSS

为什么选 Nuxt 3 而非 Next.js？

同样是 SSR 框架，Nuxt 3（Vue 生态）和 Next.js（React 生态）的核心区别在于：

维度	Nuxt 3	Next.js
上手曲线	Vue 模板语法直观	JSX 灵活但门槛稍高
数据获取	useAsyncData / useFetch	getServerSideProps / RSC
路由	文件系统路由	文件系统路由
中间件	路由中间件	middleware.ts

最终选 Nuxt 3 的原因是：Vue 的单文件组件（SFC）更适合从 data/fetch 到 template 的直观映射，个人项目不需要 React 的生态广度。

构建配置

nuxt.config.ts 的核心配置：

export default defineNuxtConfig({
  modules: ['@nuxtjs/tailwindcss'],
  css: ['@/assets/css/main.css'],
  nitro: { preset: 'node-server' },
  vite: {
    server: {
      proxy: {
        '/api':     { target: 'http://localhost:8001', changeOrigin: true },
        '/uploads': { target: 'http://localhost:8001', changeOrigin: true },
      }
    }
  }
})

开发模式下通过 Vite proxy 解决跨域，生产环境由 Nginx 统一分发。

后端：FastAPI + SQLAlchemy

为什么选 FastAPI 而非 Flask？

FastAPI 的天然优势：

类型安全 — 基于 Pydantic 的请求/响应校验，开发阶段就能捕获数据异常
自动文档 — 访问 /docs 即得 Swagger UI，无需手写 API 文档
异步支持 — 虽然本博客用同步模式，但未来需要 WebSocket 或长连接时无需换框架

启动入口 main.py：

app = FastAPI(title="Blog API", lifespan=lifespan)
# 注册所有路由
app.include_router(articles.router)
app.include_router(categories.router)
# ... 共 13 个路由模块

为什么用 SQLAlchemy ORM？

对单用户博客来说，ORM 似乎有些重。但实际收益：

Schema 即文档 — models.py 一目了然展示所有表结构
防注入 — ORM 自动参数化查询，无需手写 SQL 拼接
迁移便利 — 未来升级到 PostgreSQL 只需改配置文件的 DATABASE_URL

数据库：SQLite 的取舍

SQLite 的优缺点在这个项目中都很明显：

优点：

零运维——数据库就是个文件，cp data/blog.db backup/ 即备份
无服务进程——不需要 MySQL/PostgreSQL 那样的后台守护进程
足够用——单用户博客的并发量远未触及 SQLite 瓶颈

缺点：

并发写入受限——WAL 模式下可缓解
不支持存储过程/窗口函数高级特性
生产环境备份需停写操作

性能实测

在 100+ 篇文章的数据集下，带分页和标签关联的文章列表查询耗时约 15-30ms，全文搜索约 50-100ms，完全满足个人博客的需求。

架构总览

用户 → blog.vue2.xyz:443
           ↓
        Nginx (SSL 终止)
       /        |            /api/*    /uploads/*   /*
      |          |         |
   FastAPI    Nginx 直出   Nuxt SSR
   :8001     静态文件      :3000
      |                     |
    SQLite              FastAPI (SSR 拉数据)

核心原则：Nginx 作为唯一入口，后端服务不对外暴露端口，所有请求通过 Nginx 按路径分发。