实习校招简历差异化：0元搭建属于你自己的精美个人网站
嗨～我是可拟雀，一个后端开发工程师，毕业于某985大学，目前供职于bat某大厂核心部门后端。每天分享最新面经答案，希望在大环境不好的当下能帮到你，让你多积累面试经验。需要内推或者面经合集请评论哦。
最近有很多小伙伴反馈，面筋八股是熟悉了，但是简历总是通不过筛选，有什么好办法让自己脱颖而出么？于是今天和大家分享一个性价比很高，耗时短0花费收益大的做法：制作个人主页。
作为一个校招实习生，怎么能没有自己的个人博客呢？用csdn？未免显得太死板和大众化。自己搭建一个个人网页，既可以随心所欲地布置自己的“小屋”，又可以放上自己的技术文章，提升自己的技术影响力。
面试官如果打开了你的网页，对你会了解的更多，即使面试的时候有些问题回答的不好，但是他看了主页后也知道你有自己的学习和思考在，肯定会加大分。
技术栈
vuepress+主题快速开发
主题快速开发
选用VuePress Theme Hope是一款简洁的博客&文档主题，后续如果要添加文档也比较方便。
相比于原生的博客框架，各路大佬们开发的主题框架功能更加丰富，而且网站整体也更加美观：
搭建步骤
1.下载vscode编辑器
- 浏览器搜索 VS Code，下载对应操作系统的软件
- 执行简体中文扩展安装以保证界面语言为简体中文
2.下载Node
搜索npm中文网，进去下载即可，不需要魔法，下载后输入以下代码，看看是否出现版本号。
npm
node -v npm -v
3.创建项目
- 选择位置：为了避免偶然间触发一些奇怪的问题，而你自己不会解决，请尽量避免使用包含中文文字、表情符号或空格的文
- 打开终端cmd，进入到刚才选择的位置，执行
建议使用纯英文路径 (如: D:\projects\vuepress-theme-hope\)
npm init vuepress-theme-hope@latest my-docs // 这里的 my-docs 是一个参数，代表 VuePress Theme Hope 项目的文件夹名称，在本教程中，我们将项目生成至当前目录下的 my-docs 文件夹。可以随意替换
4.熟悉命令
打开左侧项目目录，找到 package.json ，有三个命令:
{
"scripts": {
"docs:build": "vuepress build src",
"docs:clean-dev": "vuepress dev src --clean-cache",
"docs:dev": "vuepress dev src"
}
}
这意味着你可以打开终端，进入项目所在的目录后使用:
npm docs:dev启动本地开发服务器npm docs:build构建项目并输出npm docs:clean-dev清除缓存并启动开发服务器
开发流程：我们的改动先在文件修改保存后，运行npm docs:dev，会在localhost的8000端口运行一个网页，我们点进去看看修改是否符合预期，符合预期的话再执行npm docs:build，打包这个网页到一个文件夹中，未来用其部署（详看第八节）。
5.熟悉Markdown
VuePress 是以 Markdown编写的。你项目中的每一个 Markdown 文件都是一个单独的页面。
默认情况下，页面的路由路径是根据你的 Markdown 文件的相对路径决定的。
由于你的项目是通过创建助手生成的，那么你会得到以下文件结构:
└─ src ├─ demo │ ├─ ... │ └─ page.md │ └─ markdown.md │ └─ README.md ├─ ... └─ README.md
你的 Markdown 文件对应的路由路径为:
|
|
|
|
|
|
项目完整目录：
VuePress 只控制 VuePress 项目文件夹中的文件，也就是默认模板生成的 src 文件夹，项目下的其他文件不受 VuePress 控制。
一个基本的项目结构如下:
.
├── .github (可选的) → GitHub 配置文件存放路径
│ └── workflow → GitHub 工作流配置
│ └── docs-deploy.yml → 自动部署文档的工作流
│
├── src → 文档文件夹
│ │
│ ├── .vuepress (可选的) → VuePress 配置文件夹
│ │ │
│ │ ├── dist (默认的) → 构建输出目录
│ │ │
│ │ ├── public (可选的) → 静态资源目录
│ │ │
│ │ ├── styles (可选的) → 用于存放样式相关的文件
│ │ │
│ │ ├── config.{js,ts} (可选的) → 配置文件的入口文件
│ │ │
│ │ └── client.{js,ts} (可选的) → 客户端文件
│ │
│ ├── ... → 其他项目文档
│ │
│ └── README.md → 项目主页
│
└── package.json → Nodejs 配置文件
6.站在巨人的肩膀
选择我们喜欢的风格，在开源项目的基础上二次编辑：开源项目合集
7.打包项目
- 运行命令
npm docs:build
如果你在使用模板，网站内容将会输出到 VuePress 项目的 .vuepress/dist 文件夹下。这些文件就是 VuePress 的最终输出结果。
8.部署到免费的 Github Pages
我们的博客就算是正式的做好了，接下来我们部署到免费的 Github Pages 上。我们在 Github 上新建一个仓库，这里我取得仓库名为：kenique。
对应，我们需要在 config.js 添加一个 base 路径配置：
module.exports = {
// 路径名为 "/<REPO>/"
base: '/kenique/',
//...
}
然后我们在项目 kenique 目录下建立一个脚本文件：deploy.sh，注意修改一下对应的用户名和仓库名：
# 确保脚本抛出遇到的错误
set -e
# 生成静态文件
npm run docs:build
# 进入生成的文件夹
cd docs/.vuepress/dist
git init
git add -A
git commit -m 'deploy'
# 如果发布到 https://<USERNAME>.github.io/<REPO>
git push -f **********:{用户名}/{项目名}.git master:gh-pages
// 如果没有配置密钥也可以用https协议
git push -f https://github.com/{用户名}/{项目名}.git master:gh-pages
cd -
然后打开终端命令行切换到 kenique 目录下，执行 sh deploy.sh，就会开始构建，然后提交到远程仓库，注意这里提交到了 gh-pages 分支，我们查看下对应仓库分支的代码：
我们可以在仓库的 Settings -> Pages 中看到最后的地址：
像我最后生成的地址就是 {用户名}.github.io/kenique
end~
过程中遇到任何问题请评论哦~阿雀会一一解答的。
#简历##大厂##面试##面经##个人主页#专注于最新各大厂最新面筋解析
投递巨人网络等公司7个岗位