我用HTML寫簡歷

王晗發布于2019-08-02 11:34 / 1099人閱讀

摘要：打印背景色結語最后寫簡歷的事情，也被我們工程化了，想想也是省心省力。可以發揮我們的想象，加入各種好玩的東西，再也沒人有跟我一樣的簡歷樣式了。這里寫了一個簡單的項目，僅供參考地址

本文屬于原創文章，轉載請注明--來自桃源小盼的博客

起因

每次換工作寫簡歷都是有點痛苦的事情，尤其是下載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動態簡歷

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/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