包含关键字 前端 的文章

本文是我最近对Node.js学习过程中产生的一个想法,提出来和大家一起探讨。

Node.js的HTTP服务器

使用Node.js可以非常容易的实现一个http服务,最简的例子如官方网站的示例:

var http = require('http');
http.createServer(function (req, res) {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.end('Hello World\n');
}).listen(1337, '127.0.0.1');

这样就快速的搭建了一个监听在1337端口所有http请求的web服务。
但是,在真正的生产环境中,我们一般很少直接使用Node.js作为面向用户的最前端web服务器,原因主要有以下几种:

  • 基于Node.js单线程特性的原因,其健壮性的保证对开发人员要求比较高。
  • 服务器上可能已有其他http服务已占用80端口,而非80端口的web服务对用户显然不够友好。
  • Node.js对文件IO处理并没太大优势,如作为常规网站可能需同时响应图片等文件资源。
  • 分布式负载场景也是一个挑战。

所以,使用Node.js作为web服务更多可能是作为游戏服务器接口等类似场景,大多是处理不需用户直接访问且仅作数据交换的服务。

基于Nginx作为前端机的Node.js web服务

基于上述原因,如果是使用Node.js搭建的网站形的产品,常规的使用方式是在Node.js的web服务前端放置另一个成熟的http服务器,如最常使用的是Nginx。
然后使用Nginx作为反向代理访问基于Node.js的web服务。如:

server{
    listen 80;
    server_name yekai.me;
    root /home/andy/wwwroot/yekai;

    location / {
        proxy_pass http://127.0.0.1:1337;
    }

    location ~ \.(gif|jpg|png|swf|ico|css|js)$ {
        root /home/andy/wwwroot/yekai/static;
    }
}

这样就比较好的解决了上面提出的几个问题。

使用FastCGI协议通讯

- 阅读剩余部分 -

树莓派(Raspberry Pi)是啥?树莓派有啥用?清参考wikipedia上树莓派条目。
入手玩了几天,网上也有一大堆使用树莓派开发的各种好玩的东东(比如这个这个这个)。
其实,借助树莓派来实现一些好玩的玩意是非常方便和简单的,因为他提供了GPIO引脚可用来做硬件控制开发。更方便的是他能非常方便支持各种语言来驱动(理论上应该是能在linux环境下支持文件操作的语言都行),比如python(这也是官方推荐语言)、php和js。
举个例子,如何使用nodejs如何通过树莓派上的gpio控制步进电机呢。首先步进电机是需要驱动器的,这个可以在网上买到现成的模块。以5线4相为例,我们只需要依次给驱动板4个IN端高电平就行了,其实逻辑就像前端页面中最简单的switch组件实现啦(友情提示下,因为读写gpio都是异步操作且相对低效所以尽量自己实现状态管理避免过多读写gpio操作)。其他的如直流电机、二极管、继电器、各种传感器等更少I/O口的就更简单控制了。
我实现的一个封装见:pi-moto,以及视频演示
同时,网上看到有些朋友在询问如何在国内购买到树莓派。我是在element14购买的,大概一周的样子就到了。步进电机驱动模块可以直接在淘宝搜ULN2003芯片应该就能出来一堆了。

早两天$M发布了IE9,于是很兴奋的想装一下这个我最不喜欢的浏览器的传说中最优的版本。不过安装过程出现了点意外,所以在这里分享下。首先给几个想要安装IE9浏览器的同学一些建议性的提示:

  1. 到这里下载离线安装包版本吧,如果你的网速和我一样很慢。
  2. 记得安装之前将这个页面给出的前置安装条件如更新包等准备好。

好了,回归正题。我是上面的条件都做好了,不过安装过程一直还是提示安装没有成功,也没有明确的错误提示,这就是windows下很多软件的优良传统,只告诉你安装成功或失败,而不告诉你具体为啥原因,更好的传统是不会显示的给你个log信息。然后我只能人肉去找它的log看了,跑到C:\Windows\Logs,果然有个“IE9_NR_Setup.log”的文件,结果发现这个文件根本就是坑爹,啥有用的信息都木有!就是把他的安装界面步骤用个文本描述了一遍而已。然后不知道是最近RP暴涨了还是咋滴,居然让我随便的一不小心在C:\Windows这个下面发现了一个“IE9_main.log”的文件(当时就火大,尼玛随便在我windows目录下放log这样滴文件干啥,$M你真是伤不起啊,有木有!有木有!!)。不过在这个文件发现了一行最重要的信息:
Process exit code 0x00000011 (17) 
[The system cannot move the file to a different disk drive. ]

因为家里用的老爷机C盘空间太小,又装了多个系统不敢随便格了重装Windows,那是各种引导的纠结,你们懂的。所以给windows下的User和'Program files'目录给放其他盘然后搞了个软链。顺带友情提示下,在windows vista以上版本系统已自带mklink.exe工具。

如果你也和我这样的情况,那么下面我做的可能就是你要做的了。

首先删除c盘下'Program files'这个软链,然后将原来的'Internet Explorer'放回到它“真正”的位置,安装IE9,然后将升级完的'Internet Explorer'再放回去(做这一步的时候你需要有多系统或者借助PE盘,因为windows不允许直接拷贝这个目录出去),然后重新将软链建立。That's all.

用好奇的话说,这样我就“治愈”了IE9啦,哈哈。这个文章里面用了好多“潮流”的词汇,是因为我发现现在连Qwrap的作者JK同学都比我潮了,我居然又一次成为WED最out的淫了,所以最近准备在好奇的带领下深刻学习各种脸饼少女啦。

然后,希望这篇文章永远不要遇到哪个倒霉蛋在下面留类似下面的言:“谢谢,正好遇到和LZ一样的问题”。

你是不是正在找一份前端开发方向的工作或实习机会呢?

如果回答是:“是!”。那么太有缘分了,我们也正在找你。

我们是谁?

  • 我们是WED——百度电子商务技术研发部前端开发团队。
  • 我们是专业的前端开发团队,致力于为百度电子商务产品的用户打造最佳体验。
  • 我们是年轻的技术团队,明年1月份才迎来她的第三个生日。
  • 我们是充满快乐的团队,她的官方全称是Web Engineering & Development,但更多情况我们称为:We Enjoy Days~
  • 我们是拥有很多美女、很多帅哥、很多牛人的优秀团队。

加入WED团队,你可以做这些事情:

  • 为百度最优秀的互联网产品改善用户体验
  • 让自己亲手开发的作品被亿万人使用
  • 和众多技术牛人一起钻研最新前端技术
  • 和许多优秀团队进行技术交流
  • 为Web标准和W3C做点自己能做的事儿

加入WED团队,你可以拥有这些:

  • 一边工作一边聊天、搞笑、吃零食
  • 随时表达你的想并得到关注和支持
  • 技术全面发展、辅导和长期的培养计划
  • 享受亲如兄弟姐妹的团队氛围
  • 个人自由支配的时间和发展空间
  • 得到为团队成员精心设计的有趣纪念品

加入WED团队,你可以同我们一起分享这些评价:

  • WED团队是强大专业的团队,快速响应需求,有效率有质量地完成任务
  • WED团队是无所不能的团队,看似不可能实现的交互效果,在不经意间被轻松搞定
  • WED团队是创新求变的团队,我们不时有新想法,迎接新变化,不断给新的惊喜

如果

(你决定成为国内最专业前端开发工程师
&& 你喜欢轻松愉快地工作
&&你享受团结、自由、像一个大家庭般的团队氛围)

只要你接触过这些技术中的一部分

(html/xhtml、css、页面架构和布局
|| Web标准、表现与数据分离、html语义化
|| JavaScript或ActionScript
||php、ruby、python或perl)

只要你能做到

(热爱前端开发这个事业
&& 有很好的学习能力和逻辑思维能力
&& 不错的团队意识和沟通影响力 )

那么,点击下面的链接,加入我们吧:

http://hr.baidu.com/www/job/jobDetail.action?jobId=2259

你也可以直接将你的简历发送给我

突然觉得HTML越来越乱了,现在满世界都在喊着HTML5,前端同学好像都把他当作了一个救世主。

HTML是一门标记语言(Markup Language),标记语言在于他的设计不需要逻辑功能,他最主要的作用就是用确定的标签(在html中是HTML elements)来容纳有不同的内容。其实世间万物本来就有他自己的意义的,在网页上显示出来的一切文本、图像、视频也是。一块巧克力不把它放到巧克力盒子里我们一样知道它是巧克力,只是为了方便生产、运输、卖出的识别我们大多会将巧克力用包装装起来。一个图像我们不用img标签包含,浏览器也是有可能知道它是一个图像的,从一定程度上来说,超文本标记语言的发展是浏览器工业化发展的一个象征。将同类的的东西放到同一个特定的“容器”中,在oop中来说,就是类的思想了。

于是,真正引发的问题就是这个容器究竟该设计得多“大”?这就是设计中经典的抽象程度的问题了。阴阳五行足够概括世间万物、但不能完全描述世间万物。在HTML中,使用标签(Element)和属性(Attribute)二维结合来描述超文本资源。无奈所有的东西都是不断发展的,互联网也不例外。其实HTML5中多出来video等标签就像HTML2多出来img标签一样正常,虽然我们确实值得欢呼,也不用太为此担心兼容——想想gif、png、jpeg——我是达尔文物竞天择思想的支持者。但是我觉得HTML的设计从一开始就没有很好的考虑抽象程度这个问题,可能是为了迁就使用上的方便,最明显的就是这门语言虽然有结构树(DOM)的层级、但是没有意义上的继承,不管是从标签上还是属性上。HTML生来就是有语义的,XHTML想解决数据和结构分离,结果被传道士努力得让大家都只在乎结构和表现的分离了。XHTML2曾一度想放弃向前兼容,还推荐将图像从img标签过渡到object标签,以达到更高的抽象程度,用以更“方便”地描述互联网上将来越多的不同格式的其他资源。HTML5又干脆弄出来一大堆的极度语义化的标签。那么Microformat的出现又是因为什么原因呢?

要看清楚这些,其实我们应该明白其实W3C是一个商业组织。WHATWG更是一个商业化——最明白就是浏览器竞争——的产物。很多东西其实就是商业杂交出来的(比如最明显的代表就是鼓吹“高尚情操”的video标签),HTML的一出生就流淌着商业的血。问题还在于离开商业一切都活不了。

不要再讨论HTML5好不好、HTML5什么时候出来、我们什么时候用它。

有些东西你在思考的时候永远很难想到,比如中国特色的双核浏览器,虽然或许这只是在揠苗助长。

这是个最好的时代,这是个最差的时代。或许一直以来就是。

前天参加了w3ctech第六期的WEB标准化交流会,本期交流会的主题是:前端开发在研发流程中与其他岗位协作效率的提升。会上所有与会者对此话题都发表了自己的看法,也借这个机会了解了很多其他兄弟团队协作项目开发的经验。同时会上其他非前端职位的同学也发表了很多很有参考意义的看法。

随着交流会发表意见的同学越来越多,可以发现最终关键词一致性的落在了“沟通”上。崔凯通过“请吃饭”这一最明了的例子说明了良好的沟通方式可以有效解决跨团队协作中遇到的“困难”。月影在接下来两杯水的例子中用带有哲学又易懂的方式解释了如何从本质上解决跨部门协作难题,那就是我们放开各自心中的“成见”,通过换位思考再大家站到同一个视线上来看问题。如果大家还记得彪叔一专多长》的PPT的话,应该对引言中法拉利车队的故事印象深刻吧?

到场的同学都觉得前端需要和很多部门打交道,认为前端是“最累”的部门。这一点可能是因为到会者中大部分职业是前端开发的缘故。其实,每个部门都是“最累”的,我们需要与UE打交道,同样UE需要与PM与我们等部门打交道,我们需要和RD、QA、OP打交道,同样RD需要与PM与我们与QA与OP等部门打交道。每个部门都有需要协同合作的人和部门。当我们抱怨UE生气我们页面切出来与UE图相差的时候其实我们可以换位想想当RD将我们的HTML嵌套得“乱七八糟”的时候我们是多么生气的。

我相信在任何一家公司,所有部门的人都是在干同一件事情,那就是将这个项目这个产品做好,大家将自己各自杯子里的水倒干,拥有同样一份事业心将杯子叠到同样一个方向同一个目标。我们可以思考月影在会上提出的问题:你将你做的事情怎样看待?工作、职业还是事业?如果你不思考这个问题,那么工作中“被”遇到的问题将越来越多。相反,你就会知道你要做到什么程度会有成就感?什么时候要换家公司为互联网做贡献了。

这次交流会回来一直很有感想,因为自己所在的部门最近也遇到了一点事情。但是面对外界的质疑和猜想我们依旧保留那份创业心凝聚在一起,很高兴能和这样一群拥有事业心的同事并肩奋斗。

最后,以个人情感并代整个交流会组委会感谢腾讯北京公司提供的场地、茶水和礼品,感谢易联主机CEO tesion提供的奖品,感谢winterkejun分享的PPT,感谢所有到会的同学和所有关注w3ctech的同学。(p.s:特别赞扬在整个交流会中站着做记录的我们的场记吕婷MM,大家给点掌声!)