从零开始快速搭建个人网站
有没有想过搭建一个个人网站——效果就像你现在看到的这个界面一样？试试这个基于 MkDocs 和 GitHub Pages 的方案吧！
为什么选择这个方案
这是优点：
- 完全免费，不需要自己付钱租服务器，也没有杂七杂八的 VIP 功能什么的
- 稳定，网站基于 GitHub Pages，随时在线
- 简单，不需要花非常多的精力去学习高级技术
- 社区活跃，遇到问题就去找人提问好了
需要注意：
- 对知识基础有少量要求，需要耐心学习一下下
- 网站，尤其是网站内的图片在中国大陆访问较缓慢，甚至有时无法加载
准备材料
- 非常少量的编程知识
- 非常少量的 MarkDown 语法知识
- 基本的英文知识
- 文章创意和内容
- 一个 GitHub 账号
- 学习新知识的好奇心
- 强烈推荐：一台装有 Python、Git 与合适 IDE 的电脑
- 不需要：网站服务器、Html 和 CSS 等知识基础
- 大约半个小时到一个小时的空闲时间——然后网站就永远是你的咯
首先，准备一篇 MarkDown 格式的文章吧
本文部署方案基于 MkDocs，可以通过 MarkDown 语法快速写出美观好看的文章排版，来试着学一学 MD 语法吧~
可以把 MarkDown 理解为简易版的 Word 噜
首先创建一个 .txt 文件，将后缀名改为 .md，并使用你的 IDE 打开它。
接下来，就可以在 IDE 中根据 MarkDown 语法 编辑文件了，如果格式正确，应该会有高亮颜色指示哦？
如果你没有 IDE 又想实时预览 MD 文件的效果，不妨试试在 GitHub 文件编辑页预览，或借助第三方工具哦？例如 Dillinger
我们继续，试着在本地搭建一个网站预览吧
这一步，需要在本地运行程序和临时部署网站，因此需要敲一点代码咯。如果不想预览效果就直接发布网页的话，也可以跳过这一章，不过非常不推荐这么做就是了。
安装 Python
首先从 Python 官网下载页 下载 Python，一般来讲最新版的就可以了。安装时一定要记得勾选 Add python.exe to PATH 来着...
什么，你忘了勾选？那你可要自己查一下如何把 python 添加到系统环境变量了。
安装 IDE
如果把代码比作文章的话，那么 IDE（集成开发环境）就是 Office 全家桶哩，使用 IDE 可以快速、高效、一站式地编辑和调试代码，省心省力。
虽说没有 IDE 也能写代码，不过安装后编辑效率更高，而且能避免大部分代码拼写错误，不妨试一试。我推荐使用 VisualStudio Code
下载 MkDocs pip 包
使用 Windows键 + R 唤出启动窗口，输入 cmd 打开命令行。
在命令行中输入 pip install mkdocs-material，就会自动下载相关的依赖项目哩，省心省力。
国内下载速度可能较慢，试试这个清华大学提供的镜像源吧
pip install mkdocs-material -i https://pypi.tuna.tsinghua.edu.cn/simple如果 Ctrl+V 粘贴不正常，请在命令行空白处右键。同样的，选中文本后右键也将静默复制到剪贴板。
从这一步起，你可以自行查阅 MkDocs 官方文档 啦
在本地部署网站吧
新建一个文件夹，并打开路径，用于存放整个网站的文件，文件夹和下面的文件名都必须使用英文，不要出现空格、特殊符号、汉字等。
清空资源管理器上方的路径栏，并输入 cmd，这样子会将后续操作指定在当前文件夹而不是其他地方。
然后输入 mkdocs new .，哇哦，在路径下生成了一些默认文件。
试试看？继续输入 mkdocs serve，好像发生了什么事？
来看看，在浏览器中输入 localhost:8000，哇哦，一份默认的网页就出来了！
用自己的内容替换默认页面吧
这个简单，找到 /docs 文件夹下的 index.md 文件，用自己的文件覆盖掉，保存之后就可以实时查看效果噜。
那么到目前为止，你已经有了一个本地的网页，这个网页目前只能在你的电脑上访问，下一步是将它推送给其他人看看！
将网站部署到 GitHub Pages 吧
注册 GitHub 账号
GitHub 是全球最大的程序员交流平台，用于代码托管、版本管理、协作等多种功能。
本文的网站部署方案基于 GitHub Pages 的免费网站托管服务，因此需要注册一个 GitHub 账号。
要注册账号，访问 https://github.com，点击右上角的 Sign up 按钮，按照提示来即可。
创建一个仓库（Repository）
Repo 是什么呢？就当做是一个在线的大型文件夹好了！
在 GitHub 主页右上角的加号按钮中选择 New repository，并且将仓库名（Repository name）精确地改为 [你的 GitHub 用户名].github.io，错一个字都不行。例如，如果你叫 Chen-Luan，这里就应该填 Chen-Luan.github.io。
然后，仓库必须是 Public 的，这意味着你的网页源代码将是公开的，否则不能免费使用这个功能。
没什么要注意的，点击下面的 Create repository 创建仓库吧！
将文件提交到仓库
一般来说，我们通过 git 命令行或者 GitHub Desktop 等软件来管理经常发生变更的代码，不过在此例子中我们可以简单一些，暂时通过浏览器进行初始化。
网站上有一行细细的 uploading an existing file，选择那个，然后将整个文件夹拖进去初始化仓库吧！完成上传之后只需要点击 Commit changes 来提交就好了，后续我们可以在网页上对单个文件进行在线更改。
让 GitHub 根据你的文档编写网页
这一步我们将要求 GitHub Action 自动将我们的 MarkDown 文档转换格式为正式的网页，这种转换将在每次更新文档后自动触发，每次更新大概要一到两分钟~
回到你的仓库，点击 Add file > Create new file 按钮，在文件名中输入 .github/workflows/ci.yml，你会发现他自动把路径识别出来了，真的是太贴心了。
目前我们不需要了解具体细节，所有只要在文件正文部分输入这一大段内容就可以了：
name: ci
on:
push:
branches:
- master
- main
permissions:
contents: write
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Configure Git Credentials
run: |
git config user.name github-actions[bot]
git config user.email 41898282+github-actions[bot]@users.noreply.github.com
- uses: actions/setup-python@v5
with:
python-version: 3.x
- run: echo "cache_id=$(date --utc '+%V')" >> $GITHUB_ENV
- uses: actions/cache@v4
with:
key: mkdocs-material-${{ env.cache_id }}
path: .cache
restore-keys: |
mkdocs-material-
- run: pip install mkdocs-material
- run: mkdocs gh-deploy --force
保存文件在右上角绿色的 Commit changes 里面。
最后一步，调整发布设置
仓库上方偏右有一个 Setting 按钮，点击然后找到下方的 Pages 选项。
将 Branch 下的选项改为 gh-pages 和 /(root)，然后 Save 就可以哩！
如果一切正常，任何人访问 https://[你的 GitHub 用户名].github.io，都可以看到你的网页啦！
拓展阅读
你肯定注意到了，在执行mkdocs new .命令后，除了index.md，还自动生成了一个mkdocs.yml的文件，这个文件是控制整个网站文档结构、导航栏、主题样式、国际化插件、评论插件等内容的重要配置。
关于这些进阶教程，目前还没来得及写，不过你已经可以在 MkDocs 官方文档 先看起来啦。
The End