edfward

Web 入门小记

稍微系统地整理一下我的 web 开发入门记录 ;-)

初遇 Empathian


比较正式地开始做 web 相关的项目还是要从上上学期(2015春)接手做的 capstone project 说起(类似于毕业设计吧)。具体做的内容是通过 gamification 来尝试获得一些关于用户认知的数据(类似的东西是 ESP Game),而之前的学长留下了一整套基于 J2EE + DWR 的网页游戏代码。鉴于队友和我都对于 J2EE 充满了「恐惧」,我们便做了每个遇到类似情况的程序员都会做的决定——重写(…!)。

当时导师恰好也想将侧重点偏向于移动应用,于是我们做了一番调查之后决定在客户端用当时看起来比较成熟的 Ionic + Cordova 的基于 WebView 的技术栈(当时 react native 刚出而且只有面向 ios 的版本),方便跨平台的开发。由于 Ionic 应用了 AngularJS 框架,我简单过了一遍后者的教程就匆匆上工了。平时 vanilla js 都没怎么写过的我直接就上手偌大的这么一个框架,事后证明还是会有点坏处的…

和队友简单商讨之后顺便赶制了一个基于 web.py 的后台——选择这个框架是出于导师的强烈推(yao)荐(qiu),而它也为我们后面的开发带来了许多有趣的坑。客户端这边(我们称之为 EmpMobile),我照着模版代码依样画葫芦也是渐渐将功能一个一个实现了出来,期间除了对 promise 有点玩不转之外过程都还算顺畅,期末也是顺利跑了 demo 拿了个 A+。

问题在于正式玩起来之后发现 bug 不断,许多用了小 hack 来实现的功能总会在某种场景下出意想不到的 bug。当时代码规模比较小(2000行左右)于是没写任何 test,我们也就只好缝缝补补又三年撑了过去…

Empathian 究极进化!


暑假去了 youtube 实习,深刻地领会了测试的重要性,于是这一个学期回来重构了下代码让它显得稍微模块化之后加了 service 的 unit test(当然用的是 Karma),鉴于 controller 做 e2e test 似乎比较麻烦的样子就暂时放弃了。EmpMobile 本身的 feature 基本完成,于是和另外一个做 ad 的 team 合作了一下整合进了广告和一些实验,顺便修了一些 iOS 9 更新后造成的 bug,除此之外并没有在这上面花太多时间。而后台那边队友大爆发重构了整个后台(从300行到了3000行)并加了单元测试,顺利让我摸了半个学期的鱼。

然而某次开会的时候导师说,诶,似乎有一个 dashboard 的话会很方便我们了解这个 app 的使用及运行情况,你们做做看?于是我和队友就屁颠屁颠地打算做一个 web dashboard 出来。

按老规矩队友继续做后台我负责前端。这次我选择跳入 reactJS 的坑。事实证明 webpack+babel+react+ES6 的体验大大改善了我对 javascript(「wat」)的看法。凭着 material-ui 漂亮的模版最终也像模像样地做好了一个 dashboard 方便管理员了解近段时间的 API 调用、在线玩家数量以及 Error/Warning。可以说这就是我对 javascript 路人转粉的分水岭…

而与此同时队友再次灵感爆发用 d3.js 写了前端针对 Empathian 对象的一个可视化搜索引擎并重制了网页版游戏,那就是另外一个故事了…

ReadKeyRSS


学生生涯最后一个学期选了一门 Distributed System 的课,最后一个 project 是基于一个分布式算法做一个应用,而我一直有一个主意是做个 RSS 阅读器。动机和成品可以看这个我 po 在 v2ex 上的帖子

之前说过一上手就靠着框架搭东西总会有点坏处。在我看来不用任何框架的开发就像搭积木,自由度相对较高,而使用给定的框架写东西类似于拼图,因为开发者受到了更多的限制——除了通常的 OS 和语言带来的限制,框架本身也影响了代码的创作方式,尽管这种影响往往是利大于弊的(要不然框架有何用?)。在这个意义上移动应用开发环境(无论 Android 还是 iOS)都像是限制比较极端的框架。这次我选择尽量不用框架来进行开发,试图加深对语言的理解。

(其实到头来还是用了 jQuery 和 Bootstrap…)

大致做完这个 side project 后也算是对 HTML+CSS+Javascript 这 web 三板斧有了一定的熟悉程度吧。Github repo 戳这里

继续…


自己依然说不上是个 web developer,毕竟接触的东西还是很有限的。不过也算是开始有了兴趣,比如也会开始关注前端界的一些进展(但前端更新换代实在太快…),有空也会试试新的工具,pattern 乃至语言。感觉当一个会写程序的人还是挺有趣的——世界上有这么多东西可以折腾呢!