部署记录
📄 第一篇文章 Markdown¶
# 从零搭建 AI 博客：MkDocs + Docker + Cloudflare Pages
> 本文记录我如何从零开始，用 MkDocs 构建博客，并通过 Docker 和 Cloudflare Pages 实现自动化部署与域名绑定。目标是打造一个轻量、可维护、工程师友好的知识输出平台。
---
## 🧰 环境准备
- macOS + zsh
- Python 3.11 + uv 虚拟环境管理
- Docker + Docker Desktop
- Git + GitHub
- Cloudflare Pages + 自定义域名 littlec.tech
---
## 🏗️ 初始化 MkDocs 项目
```bash
uv venv
source .venv/bin/activate
pip install mkdocs mkdocs-material
mkdocs new .
mkdocs serve
- 本地访问
http://127.0.0.1:8000验证首页 - 修改
mkdocs.yml配置中文标题与主题 - 创建
docs/index.md内容：“欢迎来到 Li 的 AI 学习笔记”
🐳 构建 Docker 镜像（开发预览）¶
FROM python:3.11-slim
WORKDIR /app
COPY requirements.txt ./
RUN pip install --no-cache-dir -r requirements.txt
COPY . .
CMD ["mkdocs", "serve", "-a", "0.0.0.0:8000"]
docker build -t ai-blog:dev .
docker run --rm -p 8000:8000 ai-blog:dev
🏭 构建生产镜像（多阶段 + Nginx）¶
# 构建阶段
FROM python:3.11-slim AS builder
WORKDIR /app
COPY requirements.txt ./
RUN pip install --no-cache-dir -r requirements.txt
COPY . .
RUN mkdocs build --clean
# 部署阶段
FROM nginx:alpine
COPY --from=builder /app/site /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
docker build -t ai-blog:nginx .
docker run --rm -p 9090:80 ai-blog:nginx
浏览器访问 http://127.0.0.1:9090 验证生产站点。
🚀 推送到 GitHub¶
git init
git remote add origin git@github.com:xiaoxiaoc111/ai-blog.git
git add .
git commit -m "初始化博客项目"
git push -u origin main
- 使用 SSH key 连接 GitHub，避免密码认证失败
- 仓库地址：github.com/xiaoxiaoc111/ai-blog
🌐 部署到 Cloudflare Pages¶
- 登录 Cloudflare → Pages → 创建项目
- 连接 GitHub 仓库
ai-blog - 构建参数填写：
- Build command:
mkdocs build - Output directory:
site - Root directory:
.
部署成功后生成预览域名：
https://ai-blog-7jw.pages.dev
🔗 绑定自定义域名 littlec.tech¶
- 在 Pages 项目中添加域名
littlec.tech - 在 DNS 设置中添加 CNAME 记录：
名称：@ 或 www 值：ai-blog-7jw.pages.dev - 验证成功后可访问：
https://littlec.tech
✅ 总结与展望¶
这次部署过程让我重新梳理了静态站点构建、容器化、自动化部署与域名绑定的完整流程。后续计划包括：
- 内容结构优化（分类、导航、搜索）
- GitHub Actions 自动构建
- 添加 AI 工具使用记录与技术笔记
- 持续探索知识输出与自动化集成的最佳实践
如果你也想搭建一个轻量博客，不妨试试 MkDocs + Cloudflare Pages，简单、稳定、免费，还支持自定义域名和 HTTPS。 ```
你可以直接复制这段 Markdown 保存到 docs/deploy.md。
要不要我帮你顺便生成一个更新后的 mkdocs.yml，把这篇文章加到导航栏里？