我的2017年前端之路总结

原文首发于我的博客

年末了,赶着刚考完两门考试,在最后4门考试来临之前抽空写一下今年的小结。

今年格外忙。忙完本科毕设,又马上投入了研究生实验室的搬砖生涯。跟去年一样,列个今年的学习成果清单:

过去的一年

技术成果

2017.03~2017.05.07 开坑学习Three.js,完成了一个简单的机械装置展示平台(我的本科毕设)【Three.js+dat.gui】

2017.05.23~2017.07.15 基于vue2+koa2重构了福建北邮人服务系统,这是我自己的项目。开始引入eslint(以前嫌麻烦233),以后的项目也一并引入。期间在手写一些常用Vue组件的时候学习了不少东西,写了一篇Vue组件的三种调用方式【Vue2+Koa2】

2017.05.26 为了上面那个项目简单做了一个基于stylus的栅格系统css——Melody.css,用来快速做响应式开发。【stylus】

2017.06.07 协助解决实验室Vue项目里webpack的Hot Reload速度太慢的问题,做了个webpack的开发模式的插件webpack-dev-compile-optimize提升热重载速度(只在自己内部项目测试过),同期总结了一篇基于vue-cli项目的webpack构建优化文章。【webpack】

2017.07.07 博客开启持久化构建,依赖于github-page,不过加上了https以及进入了HSTS列表。第一次接触了Travis-CI,发表了一篇经验文。【Travis-CI】

2017.08.09 开坑hexo-theme-melody,写一个送给我妹子的hexo主题,效果见我博客即是。【hexo hexo-theme】

2017.10.09 写每周电影推荐的时候因为嫌弃获取电影信息步骤繁杂,于是改造了一下早期写的node小爬虫dbmovie-spider支持读取命令行信息了。【node】

2017.10.28 开始练习算法,并借机学习TypeScript和前端测试(采用了Jest)。 不过后来一直有其他事压着,没有持续,等考完试要继续。【TypeScript Jest】

2017.11.02 开坑vue-koa-demo项目的前端测试。同期写了一篇Jest 全栈测试的经验博客。【Jest】

2017.11.18 开坑PicGo,学习electron的基本开发流程,边写边学。最终完成了一个我现在写博客贴图片时很方便的工具。并于12月中发布正式版,还上了少数派首页推荐。【electron】

PS,在掘金也发了一遍推荐不过没有被推荐到首页T T

之后应该会发几篇electron开发的文章。

2017.11.30 抽空把vue-koa-demo的ssr版本做了一下。踩了一些ssr的坑。

对比去年给自己立的目标:

**算法****数据结构****Three.js -> 浏览器3D建模****回归JS语言基础****学会玩Webpack2****持续的项目开源****Python简单入门**
复制代码

感觉除了Python没怎么学之外(尴尬),其他的目标大致都有所建树,算是完成地还不错吧!

期望、目标

依然要写下2018年需要学习的东西:

  • 算法、数据结构
  • Parcel
  • TypeScript
  • Puppeteer自动化测试
  • PWA
  • 给开源库提PR
  • github robot
  • 如果可以,学习一下react

随笔

这一年来的前端的学习之路,收获还是不少的。比起去年来说,我自己觉得收获最大的就是在开源社区跟开发者、使用者的交流更多了。因为自己也有开源项目,所以很多时候一些情况也是第一次见:比如第一次遇到PR(开心不已),第一次给开源库提issue,第一次跟开发者讨论项目细节等等。今年还没有给开源库提过PR,所以明年的目标是来一个吧~

今年也是前端框架、库井喷的一年。各种新的技术涌现、较新的技术逐渐走向成熟、成熟的项目走向稳定。这种感觉似乎从我两年半前学习前端的时候就有了,不过今年真的特别强烈。也因此才有那篇流传甚广的《2017年学JavaScript是怎样的一种体验》。前端要学的东西太多了啊。不过我觉得虽然看似多,作为前端工程师,还是要有自己的大体学习路线。

我认为如今前端工程师应当分成两类,

  1. 结合Node的偏向全栈的前端,他们更注重网站的访问优化、性能提升、毫秒级别的用户体验。
  2. 结合CSS\JS的偏向用户端特效的“纯”前端工程师。这部分的前端工程师通常来说必须要有自己的设计认知。

很多优秀的前端工程师都是设计师出身。比如TJ,比如尤雨溪。但是却不是很常听说优秀的设计师是前端工程师出身。这就是因为现在很多学前端的人还是在认为自己能够写个页面、套个模板,厉害点的还原个页面就行了。殊不知,你要学习的不仅仅是前端配套的HTML\CSS\JS,你还需要知道结合了Nodejs后带来的一系列现代开发工具和工程化的流程。不再是只会用个bootstrap+jquery做个页面就完事的年代了。刀耕火种的年代已经过去,可是还是有人在抓着旧石器不放。

不过还是需要强调一下,基础真的很重要。我身边遇到太多半路“出家”,自愿也好,被迫也罢来学前端的同学,他们很多都是草草几天看完HTML\CSS\JS基础,然后就直接用上Vue、React来写项目了。连npm都不知道是什么东西的他们,很多时候写起前端来非常痛苦。前端不再是以前那样认为的是一门可以速成的技术了啊,现在而言,至少入门门槛高了不少。

前端圈还是太浮躁了点。还是沉下心来,好好钻研自己喜欢的技术吧。

另外,由于最近出现的诸如PWA、Electron、RN、微信小程序等由前端主导的新技术,很多人就说了“啊iOS开发要完啦”、“啊安卓开发要完啦”、“要转行前端啦”等,我觉得其实还没有必要恐慌到那个程度。诚然如今前端能做的事不少,但是局限性还是很强。PWA由于依赖高版本Chrome在一般安卓机器上体验依然不怎么样,想做出像原生一样的效果还是受限于机能,iOS就更别说了,虽然safari开始支持service worker,但支持PWA还有待时日;Electron虽然能开发跨端应用,不过还有很多的局限,比如应用体积实在大,比如无法获取外部当前鼠标选中的文件等等。所以对于新技术应该理性看待,自己亲手实践一下,而不应盲目从众。

总结一下

今年的技术栈成长:

  • 更加深入Vue的开发
  • 开始学习Three.js
  • 开始用上ESLint
  • 开始学习TypeScript
  • 开始使用前端测试(Jest)
  • 开始学习Electron
  • 开始练习算法
  • 对前端工程化+自动化有更多的实践和体会
  • 持续维护三个开源项目:vue-koa-demo、hexo-theme-melody、PicGo
  • 学习持续集成

希望我的2018年能够继续有所收获!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/255835.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

对软件工程的疑问

在大学时光中学习了算法编程后,我发现我对于源程序理解很差,我只会很低程度的写代码,但是基本描述不出来。所以我的编程很差,而且由于我很少打代码,所以我的编程能力基本没有多少提高,我也没有发现该学什么…

【深度学习】——分类损失函数、回归损失函数、交叉熵损失函数、均方差损失函数、损失函数曲线、

目录 代码 回归问题的损失函数 分类问题的损失函数 1、 0-1损失 (zero-one loss) 2、Logistic loss 3、Hinge loss 4、指数损失(Exponential loss) 机器学习的损失函数 Cross Entropy Loss Function(交叉熵损失函数) 交叉熵优点 Mean Squared E…

伺服电机惯量问题

在伺服系统选型及调试中,常会碰到惯量问题。 其具体表现为:在伺服系统选型时,除考虑电机的扭矩和额定速度等等因素外,我们还需要先计算得知机械系统换算到电机轴的惯量,再根据机械的实际动作要求及加工件质量要求来…

【转】应用架构一团糟?如何将单体应用改造为微服务

概述 将单体应用改造为微服务实际上是应用现代化的过程,这是开发者们在过去十年来一直在做的事情,所以已经有一些可以复用的经验。 全部重写是绝对不能用的策略,除非你要集中精力从头构建一个基于微服务的应用。虽然听起来很有吸引力&#xf…

Linux 解决ssh连接慢的问题

备份文件 cp /etc/ssh/sshd_config /etc/ssh/sshd_config.bak 编辑文件 vi /etc/ssh/sshd_config 输入/ 查找GSSAPIAuthentication 设置如下 GSSAPIAuthentication no # 是否允许使用基于 GSSAPI 的用户认证。默认值为"no"。仅用于SSH-2 详细解释 输入/ 查找UseDNS …

ABB机器人与PC计算机控制口连接 超级终端 命令清单

条件: 9 针串口通信 RS232。 PC 启动超级终端软件。Windows -> Start -> Accessories -> Terminal 通信设置: 1. 波特率 9600 8 位2. 1 个停止位 没有奇偶校验3. 没有 Modern 采用直接串口连接4. 使用 Xon/Xoff 通信形式当故障发生时&#xff0…

【Hibernate】Hibernate系列6之HQL查询

HQL查询 6.1、概述 6.2、分页查询 6.3、命名查询 6.4、投影查询-部分字段查询 6.5、报表查询 6.6、迫切左外连接、左外连接 6.7、迫切内连接、内连接 6.8、QBC查询、本地查询 转载于:https://www.cnblogs.com/junneyang/p/5254641.html

【深度学习】——梯度下降优化算法(批量梯度下降、随机梯度下降、小批量梯度下降、Momentum、Adam)

目录 梯度 梯度下降 常用的梯度下降算法(BGD,SGD,MBGD) 梯度下降的详细算法 算法过程 批量梯度下降法(Batch Gradient Descent) 随机梯度下降法(Stochastic Gradient Descent&#xff09…

Javascript隐式转换

乱想 javascript为什么需要隐式转换?如果没有会出现什么情况? 找了一圈没有看到关于这个的讨论,只好自己研究了,可能不一定正确,自行辨知。 郁闷就是郁闷在好好的,为什么要搞个隐式转换,一般来讲…

双工位机器人 焊接夹具注意事项 o(╯□╰)o

焊接夹具设计注意事项 一套完美的夹具,需要机械设计人员正确的设计思想,良好的配件质量,钳工负责认真的装配质量,卡具在使用中不断的修磨和改进,才会达到好的效果。 本人非机械设计,只是在使用焊接卡具过程中遇到了很多卡具设计上…

【公共类库】加密解密

public static class MyEncryption{#region Md5加密/// <summary>/// 使用MD5加密/// </summary>/// <param name"str">需要加密的数据。</param>/// <param name"kind">加密类型&#xff1a;1-普通加密&#xff1b;2-密码加…

使用JOTM实现分布式事务管理(多数据源)

使用spring和hibernate可以很方便的实现一个数据源的事务管理,但是如果需要同时对多个数据源进行事务控制,并且不想使用重量级容器提供的机制的话,可以使用JOTM达到目的. JOTM的配置十分简单,spring已经内置了对JOTM的支持,一.<bean id"jotm" class"org.spri…

【机器学习】——《机器学习实战》面试复习

目录 一、机器学习概念 二、机器学习步骤 三、有监督学习 1、k-近邻算法 核心思想 实例&#xff1a;手写数字的识别 优缺点&#xff1a; 2、决策树 相关概念 核心思想 一些小技巧 优缺点 3、神经网络 4、SVM——支持向量机 核心思想 SVM和SVR的区别 ​ 优缺点…

一键分享代码

文章出处&#xff1a;http://share.baidu.com/code/advance 一、概述 百度分享代码已升级到2.0&#xff0c;本页将介绍新版百度分享的安装配置方法&#xff0c;请点击左侧列表查看相关章节。 二、代码结构 分享代码可以分为三个部分&#xff1a;HTML、设置和js加载&#xff0c;…

ubuntu安装LDAP

参考文献&#xff1a; https://help.ubuntu.com/12.04/serverguide/openldap-server.html&#xff08;最主要的&#xff09; http://www.linuxidc.com/Linux/2011-08/40020.htm http://blog.chinaunix.net/uid-24276740-id-3360306.html 前言 在网上搜索ldap的安装配置&#xf…

58.贪心算法练习:  最小新整数

总时间限制: 1000ms 内存限制: 65536kB 描述 给定一个十进制正整数n(0 < n < 1000000000)&#xff0c;每个数位上数字均不为0。n的位数为m。现在从m位中删除k位(0< m)&#xff0c;求生成的新整数最小为多少&#xff1f;例如: n 9128456, k 2, 则生成的新整数最小…

ABB机器人之LOADDATA

ABB机器人之LOADDATA loaddata是用来描述连接到机器人机械接口的负载&#xff08;机器人的安装法兰&#xff09;。loaddata数据通常定义有效载荷或负荷&#xff08;通过指令gripload设置机器人抓手负载 或mechunitload指令设置变位机负载。loaddata通常也作为tooldata的一部分&…

【深度学习】——性能指标(ROC、MAP、AUC等)

目录 一、分类任务性能指标 1、混淆矩阵 2、精确度ACCURACY 正确数/总数 3、查全率&#xff08;RECALL&#xff09;——真正正样本中预测正确的比例 4、查准率&#xff08;precision&#xff09;——预测为正样本中的预测正确的比例 5、F-score——对查准率和查全率进行结…

【深度学习】——过拟合的处理方法

目录 一、什么是过拟合&#xff1f;&#xff08;overfitting&#xff09; 二、过拟合的表现&#xff08;判定方法&#xff09; 训练集、测试集、验证集区别 测试集与验证集的区别 三、产生过拟合的原因 1、样本方面 2、模型方面 四、避免过拟合的方法 1、样本方面 1&…

ASP.NET页面的字符编码设置

在用ASP.NET写网上支付的接口程序时&#xff0c;遇到一个奇怪问题&#xff0c;通过表单提交过去的中文全是乱码&#xff0c;英文正常。而用asp程序进行测试&#xff0c;可以正常提交中文&#xff0c;asp页面中有这样的HTML代码&#xff1a; <meta http-equiv"Content-T…