我用HTML写简历

王晗发布于2019-08-02 11:34 / 1103人阅读

摘要：打印背景色结语最后写简历的事情，也被我们工程化了，想想也是省心省力。可以发挥我们的想象，加入各种好玩的东西，再也没人有跟我一样的简历样式了。这里写了一个简单的项目，仅供参考地址

本文属于原创文章，转载请注明--来自桃源小盼的博客

起因

每次换工作写简历都是有点痛苦的事情，尤其是下载word模板，各种注册流程，有的还得买积分，冲会员，甚是不爽。就算下载好了，修改其中的一些细节也不太熟悉各种功能，由于长期不用word，早把很多设置功能抛之脑后。

忽然有一天灵感涌上，这种简易的模板样式，对于一个前端工程师来说，写个页面分分钟的事，只要能把html转成pdf格式这事就成了。

Puppeteer

Puppeteer是谷歌出的一个headless自动化工具。

利用网页生成PDF、图片

抓取网站内容

自动化表单提交、UI测试、键盘输入等

创建一个最新的自动化测试环境

用来把html转换pdf，虽然是有点大材小用，但是很适合，渲染效果也是足够放心的。

install

# > Node v6.4.0
npm i puppeteer --save

但是安装这里有坑位，还好前人踩过坑了，失败的人点这里，笔者也是下载失败了~~~

index.html

具体怎么写得养眼，就是自己的事情了，这里提供一个简单的模板。




    
    我的简历
    
    


    
    主要内容

gulpfile.js

既然想要写得爽，怎么也得来个热更新吧，搞个简单的自动化工具。
Puppeteer只能访问http地址，所以还需要静态资源服务

npm i --save browser-sync gulp gulp-notify

browser-sync 提供静态服务器和热更新

gulp 自动化工具

const gulp = require("gulp")
const notify = require("gulp-notify")
const browserSync = require("browser-sync").create()
const reload = browserSync.reload

// 热更新
gulp.task("styles", function () {
    return gulp.src("src/*.css")
        .pipe(reload({stream: true}))
        .pipe(notify({message: "Styles complete"}))
});

// 静态资源服务
gulp.task("serve", ["styles"], function () {
    browserSync.init({
        server: {
            baseDir: "./src"
        },
        port: 7000,
        // 关闭右上角通知
        notify: false
    })

    gulp.watch("src/**/*.css", ["styles"])
    gulp.watch("src/**/*.html", reload)
})

build.js

只差转换生成了，这里用到了await语法，否则层级太深。

(async function () {
    const path = require("path")
    const puppeteer = require("puppeteer")
    const browser = await puppeteer.launch()
    const page = await browser.newPage()
    await page.goto("http://localhost:7000")
    await page.pdf({
        path: "resume.pdf",
        format: "A4",
        // 打印背景色
        printBackground: true
    })

    await browser.close()
    console.info("build done")
})()

结语

最后写简历的事情，也被我们工程化了，想想也是省心省力。可以发挥我们的想象，加入各种好玩的东西，再也没人有跟我一样的简历样式了。

这里写了一个简单的项目，仅供参考demo地址

GPU云服务器云服务器用java写简历 html简历简历html html动态简历

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/52976.html

【专栏第一篇】分享实用美国求职，面试经历，技巧，以及超实用网站

摘要：目前是刚到美国个多月，分享在美国求职的经历，目前已有面试进入背调阶段，把我期间的准备分享给大家。国内说到关系，大多是负面的，但是美国这边叫，他们确实对这个很推崇的。前言：先自我介绍一下，我是新晋前端小白白，15年毕业之后，在相关领域工作3年，但一直都在自我提升阶段。目前是刚到美国2个多月，分享在美国求职的经历，目前已有面试进入背调阶段，把我期间的准备分享给大家。愿同道中人共同进步！有...

smallStone 2019-08-22 18:44 评论0 收藏0
【专栏第一篇】分享实用美国求职，面试经历，技巧，以及超实用网站

摘要：目前是刚到美国个多月，分享在美国求职的经历，目前已有面试进入背调阶段，把我期间的准备分享给大家。国内说到关系，大多是负面的，但是美国这边叫，他们确实对这个很推崇的。前言：先自我介绍一下，我是新晋前端小白白，15年毕业之后，在相关领域工作3年，但一直都在自我提升阶段。目前是刚到美国2个多月，分享在美国求职的经历，目前已有面试进入背调阶段，把我期间的准备分享给大家。愿同道中人共同进步！有...

lufficc 2019-08-02 10:54 评论0 收藏0
【专栏第一篇】分享实用美国求职，面试经历，技巧，以及超实用网站

摘要：目前是刚到美国个多月，分享在美国求职的经历，目前已有面试进入背调阶段，把我期间的准备分享给大家。国内说到关系，大多是负面的，但是美国这边叫，他们确实对这个很推崇的。前言：先自我介绍一下，我是新晋前端小白白，15年毕业之后，在相关领域工作3年，但一直都在自我提升阶段。目前是刚到美国2个多月，分享在美国求职的经历，目前已有面试进入背调阶段，把我期间的准备分享给大家。愿同道中人共同进步！有...

forrest23 2019-08-30 15:54 评论0 收藏0
从简历被拒到收割今日头条 offer，我用一年时间破茧成蝶！

摘要：正如我标题所说，简历被拒。看了我简历之后说头条竞争激烈，我背景不够，点到为止。。三准备面试其实从三月份投递简历开始准备面试到四月份收，也不过个月的时间，但这都是建立在我过去一年的积累啊。本文是无精疯同学投稿的面试经历关注微信公众号：进击的java程序员K，即可获取最新BAT面试资料一份在此感谢无精疯同学的分享目录：印象中的头条面试背景准备面试 ...

tracymac7 2019-08-15 17:57 评论0 收藏0