我在阿里这仨月 前端开发流程 前端进阶的思考 延伸学习的方式很简单:google 一个关键词你能看到十几篇优秀的博文,再这些博文中寻找新的关键字,直到整个大知识点获得突破

我在阿里这仨月css

Alibaba 试用期是三个月,转眼三个月过去了,也到了转正述职的时间。回想这三个月作过的事情,不少很杂,但仍是有重点。

本文谈一谈工做中遇到的各类场景,须要用到的一些前端知识,以及我对前端进阶学习的一点思考。html

1、漫谈

刚入职不久阿里巴巴就上市了,这是件振奋人心的事情。实际上在正式入职以前,我就已经在淘宝UED实习了三个月,因此这边的工做环境和开发流程都比较熟悉了。前端

在工做中,遇到了不少这样的场景:git

1. 线上 bug 处理

运营:“嘿,小胡子,有客户反馈这个提交表单的页面中,上传图片预览老是失败,麻烦你跟进下这个case~”。
小胡子哥:“哦,好的!”web

这个时候手头可能有不少工做,但记住一个原则,线上问题的优先级是最高的,“客户第一”是阿里也是全部公司必须秉承的一个价值观理念。编程

打开浏览器,发现我这边并无图片上传预览失败的问题,我纳闷了良久,期间让用户尝试换浏览器、电脑,未果,最后不得不远程链接客户的电脑,查看问题。(最后定位缘由为某个地区的 CDN 出了问题)json

2. 网站改版(前端开发流程)

老大:“小胡子,之后你就负责这两条业务线了哈~”。
小胡子哥:“嗯”。
某天,运营:“网站上线几个新增功能,以前的流程须要优化,本次将对 xx网站改版,几哩吧啦几哩吧啦..... 小胡子啊,几哩吧啦几哩吧啦.....”。
小胡子哥:“这个需求前端实现成本过高,是否是能够这样;这个地方的修改,几哩吧啦几哩吧啦.....好的!”。gulp

一个大的需求过来,通常会通过屡次评审。刚开始是产品GG和运营MM们互喷口水,喷完了PRM评审也就完了,那么这个时候通常就肯定要作什么啦,而后会把前端、视觉、开发等同窗都叫过去参加交互评审,交互评审敲定以后,视觉同窗就回去画图啦,这个时候后端同窗会去准备数据,前端同窗会跟视觉MM联系紧密,如影随行。后端

视觉稿设计完了以后,前端就正式投入开发了。刚开始会面临一个问题,先后端的接口谁来拟订?设计模式

后端数据还在准备中,若是后端拟订接口,则刚开始后端须要模拟数据,此时接口地址和前端开发环境还不在一个域下,取数据存在跨域问题,若是先改为 jsonp 的接口,开发完毕再改为 json 接口,那么后续程序也须要跟着一块儿改动。若是前端拟订接口,则前端须要在本地 mock 数据,若开发完毕时后端数据依然没有准备好,那么联调又是一个麻烦事儿,可能后端还得模拟一次数据,这样前端后端都实现了依次数据模拟,重复工做,冗余。庆幸的是咱们有数据接口拟订的工具,这个工具能够将接口信息以文档形式沉淀,而且提供了可跨域访问的 mock 数据,接口的修改也变得异常方便。

好,既然有工具,那我就辛苦点吧~ 写好数据接口,交给后端同窗 review,而后开始切图(作业务嘛,唉…)公司内部使用的前端框架叫作 KISSY,目前已经升级到 5.0,而使用比较多的仍是 1.4.x 版本。这是个啥玩意儿呢,不少公司没有本身的框架,因而便使用 JQ 开发,这个 KISSY 也是同样的,他就是公司的 JQuery,不过框架对业务更加有亲和力,KISSY 提供了数量庞大的组件和插件,易用性很强,但学习有必定的门槛。

使用 KISSY 完成业务逻辑的开发。咱们会将代码发布到 CDN 上,这点我须要得瑟下,阿里的前端发布系统真是好用到了极致!由于 HTML 部分是后端管的,咱们开发好 HTML/CSS/JS 以后,会将 HTML 交给后端同窗,同时将静态资源 (CSS/JS/IMG) 发布到线上,图片能够直接上传,CSS和JS在本地打包以后,push 到仓库,系统会自动完成 CDN 部署,通常前端的改动在两分钟以内就能在线上见效,一天发布几十个版本毫无压力,不像某度公司,胆战心惊的排着长队发布一个小小的改动,发布的时候还担忧别人抢先上线,本身又得 merge 代码(去年在百度实习状况仍是这样,不知道现在改善了多少)。

待后端同窗也开发完毕后,咱们会把测试MM叫到旁边,让她们帮着测试系统bug,这个时候也能够把运营MM叫过来一块儿测试,修完 bug 就能够正式上线了。

因此在阿里,前端资源是提前上线的,完了后端代码才会上。上面所说皆为 PC 端的开发流程,Mobile 端仍是有很大差别,这里就不细说了。

3. 需求的变动

小胡子哥正在得瑟顺利的完成了一个项目的开发,但是此时,运营MM跑过来讲:“某个功能由于xx缘由本期不能上线了,须要等到V2版本再发,须要前端协助删除xx模块。”
小胡子寻思着,皱了皱眉头。运营MM含情脉脉的对视着小胡子,小胡子说:“那,好吧,改完以后需求还变么?”
运营MM点了点头,而后又摇了摇头。
小胡子心想:“妈蛋”。

而后继续上述流程。

那些尚未出过校门的童鞋们,看到这里,你是否是对公司项目的开发有了大概的了解呢?以上的三个场景是十分常见的,可是在公司毫不仅仅只干这些事情。

在这三个月里,我参与了一个前端自动化检测工具的开发,完成了先后端的改造。所用到的技术嘛,稍微列一列:

  • websocket 实时通信
  • scss/less css预处理语言
  • grunt/gulp 打包工具
  • MVC 分离思想
  • Promise 异步编程框架
  • Middleware 中间件的编写
  • Express Node的框架

涉及到的技术点,不少不少,这些只是一个项目中用到的部份内容。前端,暗藏无数杀机,若是对基础东西掌握不牢靠,你会发现别人三小时搞定的事情,到你这里就得三天,由于你一直在踩坑!

2、前端进阶的思考

不少优秀的前端同窗,在学到必定水平以后,会感受学到尽头了,天天愁着怎么去学习新知识,学习什么新知识。也有不少同窗,学习的重点跟工做后的从事内容误差颇大。因此我想着能不能在这方面跟你们交流一下,一块儿探讨。

我在微博上也提出了这样的问题。不少同窗学习没有规律,今天来点这个明天来点那个,学完以后感受本身都懂了,但没有太多的平台/工具来检测本身所学是否是到位,而后忽然某一天问道,下一步我该学啥?

每一个人成长都有一个过程,在这个过程当中,咱们会经历屡次蜕变。踏过前端门槛以后,下一步要想的事情是进阶,提高本身的技能。

在进阶方面,我问个简单的问题:git,你熟练么?

前端发布资源到 CDN 采用的就是 git,诸如 add commit diff log status tag remote push merge 等等,这些 git 经常使用命令,你是否都熟悉了?git 的版本管理有哪些思路,好比线上出现了 bug,你会如何处理程序,新建分支开发?在原有基础上开发?如何管理版本?等等。

不少知识是须要花费大量的时间学习的,好比 backbone, JQuery源码分析, MVVM, 设计模式, HTTP协议, 响应式, 异步编程, 模块化, websocket, DOM监控, 本地储存, 浏览器渲染原理等等,平时学习的时候能够把这些关键字枚举下,而后针对每一个关键字延伸学习。

延伸学习的方式很简单,google 一个关键词你能看到十几篇优秀的博文,再这些博文中寻找新的关键字,直到整个大知识点获得突破。我一直都是这么学习的。

3、小结

好吧,叽哩咕噜又扯了一堆,阿里巴巴是个不错的公司,若是想过来的话,能够联系我哟~ 学习是件长久而且艰苦的事情,收拾好心情,先睡个好觉,明天搞起吧!

相关文章
相关标签/搜索