前端 技术总结

 

文章目录

• 技术拔高

• 技术成长

• 总结展望

今年是拔高和成长的一年。重构技术的拔高和前端知识的补充成长。
今年申请成为了CSDN博客专家，对写博客产生了一种特殊的感情。
今年一全年都没有“刷”和“发”朋友圈，对微信朋友圈失去了兴趣，我尝试打开看了几回，最后都以为无聊关掉了。

 

技术拔高
到如今，专职重构也快三年了。今年主要在移动web开发和css基础及技巧上有了必定的拔高，对动画有必定的理解。

移动web开发
经过对移动web开发的实践与理解，持续输出基础文章，最后结合工做实际状况，总结了一套移动web（H5）开发的知识体系，并在团队分享，若是你有兴趣，能够看如下文章：

专栏：《移动Web开发实战》
PPT：《移动Web开发实战专栏总结（PPT分享）》

这是今年成就感最高的一个输出。

CSS基础及技巧
CSS基础没有太多成体系和理论的东西，全靠本身平时细心的积累，厚积薄发，处理一些问题，兼容性（如IE8）等，处理的是否足够优雅和巧妙，能不能利用在重构知识上的优点帮助开发进行用户体验的优化，这里推荐两个。

基础：《CSS属性建议书写顺序》
技巧：《CSS技巧-根据兄弟元素的数量来设置样式》

动画
专职重构（UI开发）的同窗可能有体会，基础的就是HTML、CSS、动画。可是如何在基础上进行深刻呢，好比UI组件库、命名规范、模块组件的划分、动画的形式，调性，性能等，咱们该如何最终实现用户体验的优化，这是一个积累的过程。我将动画的基础理解和性能对比进行了梳理总结，输出两篇文章：
《Web动画形式》
《帧动画的多种实现方式与性能对比》

 

 

技术成长
除了基础的重构知识技巧提升，我对前端的知识体系也有了成长，包括在Canvas技术、JS面向对象编程、jQuery插件、Git基础操做、Vue/Nuxt、小程序等方面有必定的实践。

Canvas技术、JS面向对象编程
去年阅读和实践了SVG，入门了，虽而后续没有精进，可是这种技术就是需求驱动的。Canvas也同样。今年实践了一些Demo，体系了解经常使用开发功能，掌握了Canvas的基础，虽然下次再用起来什么都不记得了，可是不要紧，忘了用，用了忘，最后就熟悉了。在实现Canvas效果的同时，也将JS面向对象编程加入进去实现，最后输出了两篇文章。同时对JS面向对象编程也有了必定的体会。

Demo目录：https://github.com/xiangshuo1992/canvas-demo
分享文章：《Canvas星空效果（JS面向对象）》、《Canvas绘制时钟（面向对象版）》

 

jQuery插件
在重构的过程当中，为了实现全屏适配的效果，以前咱们在作移动端的时候已经找出了一种实践方案，后来须要作PC的需求，同时须要兼容IE8，在同事的启发下，我将移动端和PC的全屏适配的实现方案优化输出成JQ插件，并分享出来。
在作页面loading的重构时，我将图片预加载实现了一个JQ插件并分享。经过这两个插件的实现，体会了如何开发一个简单的JQ插件。

《单屏（全屏）适配解决方案（jQuery插件）》
《Preload图片预加载（jQuery插件）》

 

Git基础操做
以前团队使用的是SVN，因此对Git命令一直不是很了解，今年10月转岗后，前端开发须要用到Git协做，因此在一边学习，一边实践的状况下，很短的时间就学会了Git的基础操做，复杂的还不会哈，知道了Git工做流等协做模式，以后我也将这些基础的操做分类进行整理，好比文件管理，分支管理，标签管理等。后面我也将Git操做整理了一个专栏。

专栏：《Git操做管理》

Vue/Nuxt
转岗以后，由于以前也有Vue基础，因此才能快速整合重构流程，并上线了一个需求，后面又将这个需求改为Nuxt架构，同时将开发中遇到的问题整理输出。相似这样的文章，你们感兴趣能够看个人主页。

《Nuxt项目如何配置使用 Sass/postcss-px2rem/webpack-spritesmith》

 

 

总结展望虽然上面写了不少，可是放到一年来看，好像也没学习多少内容，工做上的具体细节也不方便说，但愿本身保持对技术的探索与渴望，继续精进和成长，也但愿在新的一年里，本身在前端技术领域有更多的掌握和领会，继续在博客上输出总结，让本身的分享帮助更多的人。