搭建博客，展示过往经历。让面试官更了解我，面试更稳了！ 作者：小傅哥

博客： https://bugstack.cn (opens new window) 沉淀、分享、成长，让自己和他人都能有所收获！😄 大家好，我是技术UP主小傅哥。 不少小伙伴都想放在简历上放一个动态博客链接，展示自己的过往技术经历和可运行的项目展示。通过这样的方式提高自己在面试中的竞争力。但因为没做过，又不知道从哪开始，找的一些案例教程又都很复杂。所以，小傅哥来帮你一下，让你SoEasy的搞定这东西。

当这个男人👨🏻准备下手的时候，一切技术将变得简单、容易，好理解！ 我把本次的分内容定义为简历博客，并已经做好了博客的框架（ vuepress (opens new window) ）和内容案例，以及部署需要的Nginx配置。如果你需要部署到线上，那么需要准备一台云服务器（ 2c2g 50元/1年 (opens new window) ）。另外你还可以注册一个域名（ICP备案2周），这样就可以通过域名访问你的专属博客了。【要我说，每个程序员👨🏻‍💻都应该有一个自己的域名，有了它你才有了做一些事情的可能】。 接下来我会带着你搭建一个如图所示的个人简历博客

那么，接下来小傅哥就带着你，完成下简历博客的搭建。 文末提供了8个Java实战项目，嘎嘎提升简历竞争力。💐 # 一、搭建准备 简历博客项目： https://gitcode.net/KnowledgePlanet/road-map/xfg-dev-tech-blog (opens new window) 一台云服务器，2c2g 推荐 50元/1年 https://gaga.plus/yun.html (opens new window) 云服务器搭建 Docker、安装 Portainer 教程地址（包括学习视频）： https://bugstack.cn/md/road-map/docker.html (opens new window) 域名和域名备案（ICP备案2周），未购买也可以完成本节课程的操作。 SSL 申请，如果有域名了，可以申请免费的 SSL 让域名地址支持 HTTPS。申请地址： https://yundun.console.aliyun.com/?p=cas#/certExtend/free/cn-hangzhou (opens new window) Node.js 安装，地址： https://nodejs.org/en/download (opens new window) - 选择自己机器适配的版本安装即可 # 二、项目说明 这里小傅哥已经把博客框架、内容案例、部署博客的环境，都准备好了。你只需要下载到本地就可以使用。

本博客采用 VuePress Theme Hope (opens new window) 模板进行搭建。当你能完成部署本博客后，还可以参考模板做一些其他的扩展以及各类喜欢插件的安装。 src 目录下，为博客的框架模板和已经写好的案例。在 package.json 中有一个 docs:build 用于构建，还有一个 docs:dev 用于本地启动测试。 dev-ops 提供的是博客的部署，这里的 docker-compose.yml 是 Docker 执行脚本安装 Nginx 环境。 小傅哥在 src/.vuepress-> config.ts 文件中下配置了把项目 build 到 nginx/html 文件夹。这样可以更加方便我们部署。 # 三、部署项目 当你把 xfg-dev-tech-blog 项目检出到本地，使用 IntelliJ IDEA 或者 WebStrom 工具打开后。会提示你执行 npm install 安装环境。如果没有提示你也可以自己在项目 Terminal 下执行。执行完安装就可以做博客的部署了。

1. 构建项目

打开项目的 package.json 里面有 构建 和 运行 命名。 构建的操作会把工程打包为 HTML 文件写入到 dev-ops/nginx/html 文件夹下。 运行的操作会直接本地启动服务，启动后你可以在本地预览。这样你在修改一些内容的时候也可以随时看到效果。 # 2. 构建结果

如步骤操作，完成构建。当你看到 dev-ops/nginx/html 下有对应的一堆文件了，说明构建成功了。 # 3. Nginx 配置 对于 Nginx 的配置提供了3种方式，分别包括；IP访问、HTTP域名访问、HTTPS域名访问。

1. localhost.conf 这个配置方式为了方便，没有域名的伙伴们测试使用。也就是你部署后可以直接通过IP进行访问。

server {
 listen 80;
 listen [::]:80;

 location / {
 root /usr/share/nginx/html;
 index index.html;
 }

 error_page 500 502 503 504 /50x.html;
 location = /50x.html {
 root /usr/share/nginx/html;
 }

}

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15