如何打造一个令人愉悦的前端开发环境(三)

往期回顾

前面2期都讲得是浏览器端的东西比较多,包括Webpack,虽然是Node处理的,但是还是浏览器端用的多,对于现在的前端开发来说,不懂一点服务端的东西,简直没办法活,一般的招聘要求都会加上要懂一门服务端的语言,例如:PHP,Java之类的啦。如图所示:

知乎的招聘

所以我们这期就讲Node的东西。

程咬金的三板斧

一、劈脑袋 -- 工具链

Node在前端领域使用最为广泛的就是工具链了,一期提到的构建工具都是Node写的,当然还有其他很多工具,比如:京东工程化百度开源构建工具FIS3微信发布的工作流工具等等一系列前端工具都是用Node写的。广泛的说,我认为一期提到的编辑器也算工具链的中的一种,Atom,vs code,Brackets都和Node密不可分。我个人感觉,Node的发展,实际上大大解放了前端的生产力,对于其他的服务端语言的依赖基本可以说降到最低,可以依据自己的需要编写工具来完成技术目标。

这方面大家也可以自己来产出下,例如我自己写了个小工具供自己使用:
vuejs 格式化 Atom插件
现在下载量也不错,有2000多了,还有好几个issues没有处理,哭!!

二、鬼剔牙 -- 中间层

对于很多FE来说,要搭建一个后端环境很是麻烦,而且不熟悉,容易出错(java,ruby,php),最糟的是自己不懂,出错了完全不会调试,你的表情此时是这样的:


懵逼

那么在13、14年的时候,淘宝的前端团队,开始连续发文,前后端分离的思考和实践系列文章,提到了中途岛计划,也就是把Node作为前端和服务端的中间层,也就是这个架构,

网站架构

从这种图,不难看出,Node取代原来php,java干的一部分事情,也就是我们常说的MVC框架中的VC基本都给Node来干,FE干的事情更多了,能掌握的东西多了,意味着对于自己更加灵活,可以考虑更多的组件化,工程化,性能监控,数据分析的事情。

这方面的实践大家可以参考美团这边的图文:

美团酒店

美团酒店Node全栈开发实践

三、掏耳朵 -- 火热的全栈

Full Stack developer 是近年来热炒的一个概念,究其原因,跟Node的火热不无关系,早些年讲,一个人(大牛不算普通人)既要精通java又要精通js,html,css还是很困难,很多思维都不太一样,分开也很正常,而Node的出现,为很多比较厉害的前端提供了切入到服务端的机会,语言层面的问题不在是难点,重要的对服务端的知识点的熟悉程度。Node的最后一个大招就是替换一些传统的服务端语言,例如php,ruby,java等,在业务层上面使用Node来开发服务端完全不成问题。

例如: uber的调度系统几乎都是用 node.js 编写的

这方面的文章也有很多了,大家可以自己去搜搜看,包括各种框架,还有各种开源系统,都可以找到。当然也还有各种各样的坑和问题以待大家去踩和解决。

说说自家事

我们公司来说的话,三板斧基本都用上了,打包构建自不用谈,基本每个前端都会用到,第二板斧我们公司已经基本切换过来了,年后3月启动,目前是所有的web页面都是Node作为中间层,替换了php的渲染,中间自然有很多的困难要克服,但整体上来说开发的效率还是大大提升,不需要在配置php的环境,也不用在关心各种环境的依赖,整体上自己的一个独立的服务,使用接口的形式和服务端通信。

那么三板斧为何会用到,主要是目前国内最常见的mobile的web页面,基本在微信里面流传,然后这些页面还需要一定的数据交互,而且这种页面的特点就是短平快,不需要那么严谨,这种页面特别适合前端自己一撸到底,前后端通吃,接上 MongoDB当做数据库,基本两三天之内就能开发一个活动页面出来,不需要对其他服务有任何依赖,包括微信授权都可以自己搞定,工作量其实比对接其他语言服务大不了多少,某些方面,我个人认为还减少了很多的沟通成本。

痛点-- 造就了自己的一个开源

express的路由插件

先说说这个插件做什么的: 主要是自动的加载express框架下面的路由,免得一个一个路由需要手写。

通常我们在express框架下面,写路由的时候都是一个一个的手写,然后在app.js里面去一个一个引用,一般是这样子的

手写路由

那么好一点的情况,是这样子的,分散每一个相同名字的路由到文件中,然后引用文件在app.js里面。

代码少了不少

但实际上你可能在项目中路由情况是这样子的

路由列表

你有什么想法?

我要报警了

虽然这样子也就是一个文件多两行代码,我还是不爽,我为什么要因为同一个规则而去多写这两个代码,而且10个两行,就是20行,原则上,能用机器干的事情,就不人干,而且PHP的一些MVC框架可以自动加载路由,他们会有一个文件夹的分层,很明显,路由都放到Controller文件夹下,然后根据路由名来匹配文件名的相应action,依据这个我自己就撸了一个express的自动加载路由,然后考虑了下一些特殊情况,做了点配置,不过目前只是支持一级目录,没有考虑多级目录情况,有需要可以自己添加,或者给我提issues。

照例总结

本篇文章主要讲的是关于Node的东东,它的使用方向,更偏向结合前端的使用,并非是很深入的Node原理,也算是给很多前端解惑下,为什么要使用Node,以及如何使用Node,不要盲目的听信别人的建议,需要结合自己项目情况,技术水平,以及团队配比。

更多的Node的使用细节和技巧建议关注:

美团博客

大搜车

cnode论坛

下一篇我们开启如何结合Webpack和express 搭建一个开发环境和项目目录

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,922评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,591评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,546评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,467评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,553评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,580评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,588评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,334评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,780评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,092评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,270评论 1 344
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,925评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,573评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,194评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,437评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,154评论 2 366
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,127评论 2 352

推荐阅读更多精彩内容