资讯专栏INFORMATION COLUMN

作为前端开发,如何写好一个简历

abson / 787人阅读

摘要:项目地址需求来源通常在各个招聘网站,我们填写完一些信息后,网站就可以帮助我们生成一个很不错的简历。但是作为一名开发者,尤其是前端开发者,可能对这种简历并不满意。,前端开发神器。最后,为了保护隐私。

背景

前一阵子,闲下来便开始着手做一个一直想做的东西--resume。经过几天业余时间的折腾,终于做出了一番模样。
Github项目地址:https://github.com/eternityspring/eternityspring.github.io

需求来源

通常在各个招聘网站,我们填写完一些信息后,网站就可以帮助我们生成一个很不错的简历。但是作为一名开发者,尤其是前端开发者,可能对这种简历并不满意。
这时候,相信有很多同胞们就希望能自己动手做一个很漂亮的web版的简历:

别具一格的,拥有自己的风格,不同于大众化的简历风格。

响应式的,在手机、pad、pc各个平台很方便的浏览。

可打印的,不仅仅能够在浏览器很好的展示,在需要使用的时候也可以很方便的打印出来。

有了这样一个简历,走到哪里,别人问你你可以选择掏出手机打开网站,然后展示你的个人介绍。打开网址然后打印成纸质档。

设计

有了需求,接下来就是设计了。包括界面的设计,和具体展示内容的设计。
在界面设计方面,我们可以去:Pinterest、Behance、Dribbble、花瓣、站酷等知名的设计展搜索简历或者resume,然后综合一下,做出一个适合自己的风格。
内容方面,我们可以看看传统简历的内容划分。我在制作的过程中将内容划分成了:

基本资料:姓名、联系方式之类的。

个人简介:介绍一些个人基本情况。

经验:不同时期简短的从业经历介绍。

技能:客观的对自己所掌握的工具和技术栈打个分。

常逛网站:通过经常浏览的这些网站可以看出我通常所关注的技术领域。

由于在浏览器中展示,为了好看,页面可能会很长。所以这里我把联系方式放在首屏展示,页脚也展示了一下。这样可以让浏览者便捷的联系到我。

环境搭建

Git,做代码管理版本控制。在这里我选择把源码托管在Github上,并创建了一个Github Page:
https://eternityspring.github.io。
webpack,做自动化构建。包括对js、scss的打包,还可以创建一个基于nodejs的http server已经热部署能众多功能。
webstrom,前端开发神器。不解释。

架构与编码

这里,我采用了restful的开发风格。先做出了一个纯html的版本,然后再把里边展示的个人信息放在了一个json文件中。然后引入zepto和vue.js两个js库。当然,如果你有耐心,也可以选择自己造轮子用原生的来写。这里我不想折腾,所以用了第三方。在这方面很赞同一个群友的说法:有轮子就用呗,只要不是方的就好-.-
vue.js是用来渲染数据到html页面中的。zepto是用来发请求,获取数据用的(请求工具修改为了vue-resource)。
编码调试,是最为机械的部分了,只要你是老司机,都是手起刀落嘛!

完善与点缀

做完上述功能,能不能添加点花样呢?时下css3这么火热,何不用css3添加一些过度动画,让页面中的信息展示的更自然。于是,设计一些过度效果,添加到页面中。这里我选择引入了wow.js。css3动画是自己写的。一共也没多少效果。
于是,就有了页面加载时的加载动画,有了页面滚动时,元素出现的动画。
web版的基本上是由了。那么实际中如果需要纸质版呢?so easy,打印web版呗。于是基于上边的版本做了一个打印测试,结果不尽人意。于是我查了一下,有css3的媒体查询可以控制打印样式(@media print)。如此神器,便又是一番啪啪啪的编码调试。
最后,为了保护隐私。我选择了把真实名字在打印的时候才显示。在通常只显示了昵称。

总结

比起看书,可能我更习惯于这种以需求为驱动的学习吧。通过制作这个resume,学习了webpack的使用,学习了vue的使用。学习了css3的一些新特性。学习了flex布局。多动手吧-.-
你也可以选择fork我的项目,然后改一个自己的版本:
https://github.com/eternityspring/eternityspring.github.io
当然,如果star我也不介意-.-

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

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

相关文章

  • 作为前端开发如何写好一个简历

    摘要:项目地址需求来源通常在各个招聘网站,我们填写完一些信息后,网站就可以帮助我们生成一个很不错的简历。但是作为一名开发者,尤其是前端开发者,可能对这种简历并不满意。,前端开发神器。最后,为了保护隐私。 背景 前一阵子,闲下来便开始着手做一个一直想做的东西--resume。经过几天业余时间的折腾,终于做出了一番模样。Github项目地址:https://github.com/eternity...

    KunMinX 评论0 收藏0
  • 如何写好技术简历 —— 实例、模板及工具

    摘要:在线简历生成工具,可以导出。技巧目前写简历的方式有两种普遍被认可,一种是一种是。培养新人和带团队其他项目项目该项目是,使用技术,完成功能。阅读原文点击查看简历模板。 工欲善其事必先利其器,这是自古以来的道理,所以如果想找到一份好的工作,一定要先整理一份好的简历。 模板 写简历首先要有一个好的模板,我们做技术的不同于 UX,UED,我们不需要那么花哨,但是也需要整洁干净。好的模板能让你的...

    sunnyxd 评论0 收藏0
  • PHPer面试指南-程序员如何写好一份简历

    摘要:本书的地址程序员的简历在求职的时候,尤为重要,简历就是销售自己的明信片,一份优秀的简历,能为你带来更多的面试机会。扩展阅读程序员简历应该怎么写面试时,如何向公司提问 本书的 GitHub 地址:https://github.com/todayqq/PH...程序员的简历在求职的时候,尤为重要,简历就是销售自己的明信片,一份优秀的简历,能为你带来更多的面试机会。 我自己写了不少了简历,...

    tabalt 评论0 收藏0
  • 如何写一份好的前端面试简历?

    摘要:简历的存在只有一个目的帮你约到面试。即使你通过其他方式获得了面试,当你入职的时候,还是要有这么一份纸质简历的,所以不要想着偷懒。在该系统上线后,前端性能从提升到,服务器由台减少到台通过量化的数字来增强可信度。 简历的本质 原文地址在写简历之前,我们必须清楚的了解一件事情,那就是简历是什么?它不是人生履历,不是项目清单,也不是技能大放送。简历的存在只有一个目的 —— 帮你约到面试。只要能...

    winterdawn 评论0 收藏0

发表评论

0条评论

abson

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<