当前位置: 首页 > news >正文

两年前端职业生涯总结

作者:TaylorPzreal
我的GitHub https://github.com/TaylorPzreal

时间如白驹过隙,2015年9月27日我抵达帝都的那个晚上还仿佛昨日,从此便开始帝都的工作生活,也正式开启我的前端生涯。计划于今年十一写总结,迫于公司项目压力,拖置现在,必须要做第二年的总结了,总结自己的这一年历程并憧憬未来,也写给需要的人。

来到帝都,我一直很感激三点,一是我司给予我的机会和成长的沃土,二是很感谢我司的两位前端大神阿法哥和彬哥,是他们细心耐心的带我,把我领进门,让我有了快速的成长和信心,三是感谢我司的一些人,他们跟我谈了很多,让我更深刻的去思考规划未来,让我看到了更大的世界和和更有意义的价值观,让我更深刻务实的去思考问题,真的很感谢他们。

细细回想一下,今年大致做了这些事情:

### 时间线
1. 完成了我司两个产品。(独自负责前端架构,开发,优化,维护工作)(到今年四月底)
2. 准备公司的产品发布会。(负责架构,开发等工作)(到六月底)
3. 公司的一个项目开发。(负责架构,以及协调其他3位前端同事的开发,优化,维护工作)(七月份到十二月上旬)
4. 重构我司的产品。(负责架构,开发工作,以及推动我司分享学习氛围)(至今)

### 技术线
1. 我司的第一款产品主要技术:angularjs@1.x,bootstrap3,requirejs,gulp
2. 我司的第二款产品主要技术:angularjs@1.x,bootstrap3,webpack
3. 产品发布会: angularjs@1.x,bootstrap3,webpack,es6,代码拆分按需加载
4. 项目:typescript,angular4,material,bootstrap4
5. 重构产品:react技术栈

### 其它
1. 阅读《你不懂JS》 https://github.com/getify/You-Dont-Know-JS/tree/1ed-zh-CN
2. 《JavaScript权威指南》
3. GitHub今年提交了575Commits(https://github.com/TaylorPzreal),我司的Gitlab大约提交了1000多commits。
4. 写了一个自己的网站 https://www.honeymorning.com/(由于时间很少,还不完善,还在不时继续开发,重构完善。前端Angular5,后段Nodejs,MySQL)
5. 写了8个npm包,(https://github.com/TaylorPzreal),主要有意义的是,ngx-cropper,interpolate-webpack-plugin,awesome-react,create-awesome-react.
6. 在一些开源项目上面提供了一些微薄的帮助,如quill等,也参与了一些开源项目的测试,并提交了一些问题,比如angular/material2,angular/flex-layout,ng2-image-upload等
7. 经常浏览的社区,掘金,推酷,csdn,微信订阅号
8. 看MDN,W3C标准
9. 刷题

现在谈一下我的学习和成长总结。

2015年刚入行的我,是什么也不会的我。先后有两位大神带我,让我有了快速的入门和成长,2016年的年中左右,便开始独立负责公司的另一个产品开发工作。
第一阶段:
最开始使用我司统一的架构,后来了解到了gulp,便开始看相关的官方文档,看别人的踩坑指南,很快gulp就应用到了产品中。这个基于管道的工具很好用,确实对产品有了进一步的优化,其中主要优化了js,css,html,图片这些资源的压缩。

主要需要学习的就是gulp,了解gulp常用的插件,requirejs,angularjs1.x

第二阶段:
后来了解到webpack这个构建压缩混淆工具,开始看文档写例子,去了解它的不同与高级,后来对我司的产品进行了进一步的优化,我写过的一个基于angular1.x的demo https://github.com/TaylorPzreal/webpack2-conf-test,主要的优化是,分块打包,按需加载,并使用es6语法。

主要需要学习的是:webpack及相关插件,es6语法,基于angular1.x的代码拆分按需加载

第三阶段:
从2016年9月份angular2正式发布,便开始不时的去了解学习angular2,今年7月份正式开始用angular4写我司的一款项目。angular2是用ts语言写的与angular1极不同的框架,用了之后我个人觉得比1好太多,很容易就能基于静态路由,实现代码拆分按需加载,基于组件式开发思想,很容易构建复杂应用,我用了很少的代码就实现了一个树选择列表略微复杂的组件。还支持PWA,ng5还默认支持AOT,响应式编程。TS语言本身又有很大的好处,能避免很多不必要的错误。

主要需要学习的是:typescript,angular5,PWA,rxjs

第四阶段:
从12月份下旬开始,正式学习React技术栈准备重构我司的产品,为什么用React,考虑了很多因素,个人觉得React目前是最火的框架,尤其RN当前的火热,vue很优秀,社区成长也很迅速,听说入门也极其简单,angular5在中国的使用还不是很广,从招聘数据看来angular5使用的人远少于react,vue,但到底哪一个是最好的,我也没有结论,可能只有等我都试用了解一下,才能知道每个的差别,试用场景。目前正在踩坑React技术栈。到目前倒是发现了两点:

1. angular5是一个框架,你几乎只需要安装很少的额外插件便可以进行产品项目的开发。
2. React只是一个view层,你还需要搭建很多的库插件,来构建产品的开发框架,略微麻烦一点。学习成本略高一些相比angular5。

主要需要学习的是:react,react-router,redux,react-dom
目前写了一个通用的框架awesome-react,github地址 https://github.com/TaylorPzreal/awesome-react,涵盖了一些基本的功能,支持Dll,webpack的DEV和Prod不同构建,支持fonts,图片,css modules,scss,commintlint,jest测试,eslint所有的jsx,一键格式化所有的代码,还在继续完善, 也写了一个CLI create-awesome-react,https://github.com/TaylorPzreal/create-awesome-react,可以更方便的新建基于这个框架的基本项目。

前端发展实在迅速,还有更多的库,插件或技术使用过以及准备有选择的更深入的研究应用:
rollup,GraphQL,Koa2,express,docker,d3,threejs,jointjs,electron,ionic,RN,apolla,DL,微服务,中间件,H5 game,websocket,GoLang,Firebase。。。

总体来讲,我的学习过程有这样几点:
1. 通过社区等渠道了解到一些高效技能库框架
2. 看官方文档,一般都有英文和翻译的中文文档
3. 看别人的踩坑,经验
4. 看看源码
5. 自己动手去写测试demo
6. 合理安排时间
7. 遇到问题时刻记得:Read-Search-Ask,1).多读题,多读错误信息,自己尽力思考,2).google,3).最后再去问别人。

两年学了这么多,我很精通吗?坦白讲,根本不精通,也只算达到了熟练使用,能进行熟练的开发,seo,维护等工作,底层的实现不懂啊,也没太多的时间去搞懂。记得有人说过,少折腾框架,多研究原生深度,从时间和精力上讲多去精通JS这都是最有益的,精通了JS再去学习其它会更受益。当然对于工作,我觉得首先是能工作,会工作,再做好工作,对于时间紧迫的前端就是先去了解N多库的使用,再去研究深度。

现在,在推荐一些我整理的学习资源:
* 视频:幕客网 https://www.imooc.com/
* 视频:优达学城 https://www.udacity.com/
* 视频:可汗学院 https://www.khanacademy.org/
* 图片字体取色:
https://www.pexels.com/
https://www.iconfinder.com/
https://www.storyblocks.com/stock-image
https://webkul.github.io/coolhue/
http://colorhunt.co/hot
* 电子书: 图书资源网站,几乎所有图书电子版都可以搜索下载到 http://b-ok.org/
* 社区:CSDN,掘金,前端网,知乎专栏,DZone,Medium,sitepoint, Google+
* 刷题:
https://leetcode.com/
https://www.codility.com/
https://www.freecodecamp.org/

还有很多,目前就这些吧,多了大家肯定也不看

这两年,也让我有了一些新的思维。在这个发展迅速的时代里,我们必须适应并接受时代的发展趋势,革新思维,努力进取,提高自己的格局,变通自己的思维,给自己一个远大的目标,划阶段去一个个突破实现。在我们这个能吃苦的年纪里,不要选择安逸。成功是一件很难的事情,需要你精心的设计和坚持不懈的艰苦奋斗。世界很大,不要活在周围人的世界和格局里,不要在乎眼前的利益,时间的巨轮在不停的向前推进,会有更多有意思的事情等着我们去创造和体验。

十年很长,很多事都发生了改变,一辈子太短,可能连一件事都做不好。我不喜欢安逸,但我更希望忙碌的有意义有价值,在我回首往事的时候,能让我想起并怀念这段岁月时光。

展望2018年:
1. 精通JS/HTML5/CSS3
2. DL
3. GoLang

2018我的座右铭是,精益求精的工作,不拘一格的生活。

再见2017,2018您好!

附:最后祝愿在新的一年里,每个人都身体健康,(今年7月到10月我连续三个月几乎每天都凌晨1点左右睡觉,早晨5点半左右就起床继续coding,也停止了跑步,导致到现在掉了很多的头发,是的,我才刚本科毕业两年,很恐怖,现在都用上了霸王。。。)珍爱生命,年轻也一定要早睡早起,多锻炼。

写于 2017年12月31日 北京 晚


转载于:https://juejin.im/post/5a48fdb4f265da431877179f

相关文章:

  • 云数据库Memcache版使用教程
  • 8.2. GUI
  • alertmanager源码阅读 - dispatcher
  • java8-模拟hadoop
  • 第 13 章 Barman for PostgreSQL
  • spark 源码编译 standalone 模式部署
  • 在华为设备上实施GRE隧道和IPSEC ***
  • 如何在数据库动态建表
  • 十年阿里java架构师的六大设计原则和项目经验
  • 基于 python + WebDriverAgent 的“跳一跳”小程序高分教程
  • json logstash 解析失败 ctrl-code 1
  • 5-2 equal getClass or instanceOf
  • linux kernel编译配置相关
  • 不要在构造函数中抛出异常
  • 老男孩教育教您批量建立nagios配置文件的方法
  • [NodeJS] 关于Buffer
  • 【跃迁之路】【463天】刻意练习系列222(2018.05.14)
  • Android优雅地处理按钮重复点击
  • Apache Spark Streaming 使用实例
  • egg(89)--egg之redis的发布和订阅
  • iOS 系统授权开发
  • IP路由与转发
  • Mysql5.6主从复制
  • Mysql数据库的条件查询语句
  • python 学习笔记 - Queue Pipes,进程间通讯
  • Web设计流程优化:网页效果图设计新思路
  • weex踩坑之旅第一弹 ~ 搭建具有入口文件的weex脚手架
  • 程序员该如何有效的找工作?
  • 分享一个自己写的基于canvas的原生js图片爆炸插件
  • 模型微调
  • 试着探索高并发下的系统架构面貌
  • 一道面试题引发的“血案”
  • 译自由幺半群
  • 再次简单明了总结flex布局,一看就懂...
  • 责任链模式的两种实现
  • 阿里云重庆大学大数据训练营落地分享
  • 哈罗单车融资几十亿元,蚂蚁金服与春华资本加持 ...
  • ​七周四次课(5月9日)iptables filter表案例、iptables nat表应用
  • #1014 : Trie树
  • #免费 苹果M系芯片Macbook电脑MacOS使用Bash脚本写入(读写)NTFS硬盘教程
  • (007)XHTML文档之标题——h1~h6
  • (1)bark-ml
  • (10)STL算法之搜索(二) 二分查找
  • (5)STL算法之复制
  • (Redis使用系列) Springboot 实现Redis消息的订阅与分布 四
  • (大众金融)SQL server面试题(1)-总销售量最少的3个型号的车及其总销售量
  • (接口封装)
  • (论文阅读30/100)Convolutional Pose Machines
  • (原)本想说脏话,奈何已放下
  • (转)memcache、redis缓存
  • . ./ bash dash source 这五种执行shell脚本方式 区别
  • .desktop 桌面快捷_Linux桌面环境那么多,这几款优秀的任你选
  • .NET 6 在已知拓扑路径的情况下使用 Dijkstra,A*算法搜索最短路径
  • .NET Core WebAPI中封装Swagger配置
  • .NET Core实战项目之CMS 第一章 入门篇-开篇及总体规划