求职季，教你制作一份精美的在线网页简历，程序员必看！！

时间：2023-10-16 12:06:01 | 来源：网站运营

时间：2023-10-16 12:06:01 来源：网站运营

求职季，教你制作一份精美的在线网页简历，程序员必看！！：引言

近期和学弟交流了一下找实习的相关的话题，谈到了简历这块。虽然近期没有找工作的打算，但还是会不定期的更新自己的简历。

于是将自己的简历分享了一下，没想到得到了这样的评价，心里还是挺高兴的。

简历的形式是一个在线的静态网页，托管在了 GitHub 上面，整体的效果如下图，可以直接使用浏览器的打印功能导出为 PDF 的格式。

本篇分享一下如何制作在线简历，你需要有一些前端方面的编程基础的。如果没有也没有关系，我也会附带分享一些求职简历中需要注意的一些地方，也许对你也会有所帮助。

fork & clone

首先进入托管在 GitHub 上的简历项目主页[1]，点击右上角的 Fork 按钮，等待若干秒后，你的项目列表里会多出来一个同名的仓库。

把新生成的项目 clone 到本地，就可以开始在本地进行调试和开发了。

安装依赖

项目依赖于 Node 环境，你需要先到 Node 官网[2] 下载并安装对应系统的 Node 程序。

安装好后，在命令行输入 node -v，如果出现相应的版本号，说明 Node 环境安装成功。

使用 cd 命令进入到项目目录，输入 npm install 命令，安装程序所使用的依赖环境。

再输入 npm run dev 命令，项目会进行编译，并自动打开浏览器，加载出简历的页面。

这时，就可以打开 VSCode 或者其他编辑器对简历内容进行修改了。

简历编辑

项目的整体目录结构如下：

.├── README.md├── node_modules├── package-lock.json├── package.json├── postcss.config.js├── src├── webpack-dist.config.js├── webpack.config.js└── webpack.js我们只需要对 src/ 文件夹中的文件进行修改，其他文件是项目运行的一些配置文件。

如果要修改简历内容，需要编辑 index.html 文件。如果你有前端的基础，这应该很好上手。

找到模版中对应的位置，比如个人信息部分，把中文内容改成自己的就行了。

<header class="content-hd"> <section class="title"> <div class="name"> <h1>姓名</h1> </div> </section> <section class="info"> <ul> <li>求职意向：xxx</li> <li>联系方式：xxx-xxxx-xxx</li> <li> 邮箱：<a href="mailto:phillzou#gmail.com">phillzou#gmail.com</a> </li> <li>GitHub：<a href="https://github.com/mayandev">github.com/mayandev</a></li> </ul> </section></header>如果要修改简历的样式，比如主题色、字体等等，需要编辑 main.css 文件。

比如我将简历主题色改为蓝色，只需要更改一行代码。

$theme-color: #126ab8;简历修改完后，刷新一下浏览器就可以看到最新的内容。

项目部署

项目部署前，需要先在 GitHub 仓库中建立一个名为 username.github.io 的仓库，其中 username 是你的 GitHub 账户名称。这个仓库可以生成一个域名，你可以在这个域名下创建仓库，将一些静态内容资源托管到上面，比如自己的博客。

回到项目，在命令行中输入 npm run pub 命令，会自动创建一个 gh-pages 分支并推送到 GitHub 的仓库。

打开上面 Fork 的仓库地址，点击设置，滑动到 GitHub Pages 设置选项，将分支选择为 gh-pages。

然后打开生成的网页即可看到在线的简历，将链接发给其他人，其他人通过浏览器打开可以直接访问

使用快捷键 ctrl+p 或者 command+p 调用浏览器的打印功能，可以将简历导出为 pdf 格式的文件。

Tips

简历应该站在 HR or 面试官的角度来考虑，别人是否方便打开，字体大小、颜色、排版是否舒适，内容是否有条理等等，这种为别人考虑的做事方式，也叫做同理心，而自己也会因此受益。

下面就罗列一些写简历需要注意的地方，不全面，欢迎补充。

1、只写关键的个人信息（姓名、联系方式），至于性别、生日、籍贯、自我评价等等，不建议写。

2、排版整洁，推荐单列布局，按点罗列。

3、字体统一，内容尽量只有黑色字体。对于简历中的一些链接，使用一个主题色。

4、语言简短，提炼主要内容，遵循 STAR[3] 法则，有效表达。

5、篇幅尽量控制在一页

更多的简历写法，建议上本站搜一搜，有的 HR 会在上面分享一些干货。

你也可以把你的简历发送到我的邮箱（上面的图片里有），免费帮你看，提一些修改建议。

希望大家在秋招都能找到满意的工作。

完

参考资料

[1]

简历项目主页: https://github.com/mayandev/resume

[2]

Node 官网: https://nodejs.org/

[3]

STAR: http://www.woshipm.com/pd/1267256.html