程序员日记(二)

今天是二零一二年的正月初一,外面烟花似锦,处处融融洽洽。首先跟大家拜个年,希望大家龙年大发。多多赚钱,早日移民。 ^_^


开始正题吧,这是我的第二篇程序员日记,(如果想看第一篇日记请移步:程序员日记(一))因为日记都是不定期发的,作为程序员平常也是埋头编程,“两耳不闻屏外事,一心沉浸coding中”应该不光只是我,也是大多程序员的写照。归结起来,程序员可以算是“匠人”每一个入行的程序员都是怀揣着“改变世界”的梦想的。是的,不管是Android,IPhone还是我们常用的扫描枪,超声波检测以(B超)处处都有这程序员的辛劳的编码,日以继夜的调试,尽职尽责的BUG修复和打补丁,部署和测试程序。作为行业从业人员,我想一句由客户发自内心由衷的赞叹比多拿一些物质上的奖励还要来的弥足珍贵(当然,有钱又有表扬是最好的)。

北京国之源软件有限公司,张总,昱哥,小敏,吸管姐,杨老大,张佩安,李海军,朱玲玲小胖子,李福中,徐诺,当然还有伟大的雅姐。这就是我在国之源最大的收货,为什么离开国之源,其实心里的原因我一直没有清楚的回答过老张。老张绝对是我工作以来对我最好的领导之一,对我的信任和器重我不用言语来表达,至今我还一直把自己当成国之源的一份子,虽然人不在公司,但是至少也算是在国之源有过一段快乐的回忆。

离开国之源的原因有三
  • 金钱:毫不掩饰的说,钱是一个方面,任何不以金钱作为跳槽的原因考虑在内的不是装B就是扯淡,国之源当时的工资体系确实让我倍感压力,看着身边的同事一个个都拿着高于自己N多的薪水,能不动心想想是否要另谋出路么?
  • 进步:在国之源公司基本上没啥东西持续进步,前端技术基本上都需要靠自己摸索,没有伙伴的那种孤独感,作为一个三年的前端开发工程师来说我想我要走的路还有有很长,也不擅长于在这里就开始扮演一个导师的角色,我想和大家一起进步,多分享,在技术公司,分享应该是常态化,公司的培训比较少,当然,长沙也没有北京那种环境,没事周几一个社团或者组织就会有一次免费的学习,让大家一起交流真正坐在一起作为工程师的节日。不过公司对于送员工出去培训没有任何概念,既没有鼓励也没有组织,处于一个管理的中空地带和比较尴尬的位置。对于银子不多的程序员来说,不图钱又暂时没发展,任何人都会萌生退意吧?
  • 产品理念:这是我最头疼的一个方面,也是直接导致我离开公司的重要原因,资源库,浙江网二期的改版工作,研究性学习平台。我一直有一个疑惑,我们是靠什么来驱动产品的开发?客户的需求,市场调研,还是面对面的文档确认?至少来公司的工作的这段日子。产品经理这个位置一个比较模糊。任何不以数据或者文档为原型的系统都可以把它当作自己的意淫。需求文档的细节把握不到位,原型文档的还原不到位都有可能直接导致需求还原的失真。一个软件在大目标和方向上的偏差会直接导致产品质量和成本的损耗。这应该不是我应该要教各位的了。
国之源的工期其实挺“赶”的,说实话。工期大部分都不是放在了正常的开发和需求讨论中,大部分都是在不断的需求迭代和版本的更新之间消耗了。错误的工作方式是导致软件质量无法提升的一个根本。在公司,最常见的现象就是一堆程序员从一个项目挂到另一个项目,从一个BUG修复到另一个BUG。从心理角度来分析,这样的工作模式是会让人产生非常不良的抵触情绪的。我能够理解公司在人力成本控制上的初衷,也能理解一个公司在求生存的初期碰到的问题和需要付出的代价。我谈这些也没有职责公司和诋毁公司任何同事工作不到位的意思。只是觉得有问题,大家应该提出来,然后看看怎么解决,不能解决,我们有没有替代方案ABC,让大家觉得公司注重的是“自上而下的执行力”。回归正题,一位员工同事兼几个项目其实挺不好的,首先,原来出现的问题需要修复,如果在忙的时候,大家想当然的都是为了解决BUG去解决代码,其次是为了完成功能而去CODING。最后才是安安稳稳,沉下心来进行“代码设计”。“设计”这两个字其实挺考究的,有幸在公司学习了管理上的“杨三角”理论,“设计代码”完全可以理解为是员工的思维,也就是自主能动性。调动员工的积极性创造出来的产品才是最有价值的。把员工放在单一的产品上,既能够快速的的找出软件的BUG,也能够快速的重构和重新设计软件的架构。即便从A版本递增到B版本,BUG的快速修复和新功能的叠加在一位员工上有积累,那么做出来的产品版本与版本之间的精细度和质量会越来越高,为什么谷歌公司一名工程师想升职必须要在某一个特定项目拥有十年的工作历史,而从一个项目到另一个项目不断的谷歌工程师却不受欢迎,不是没有道理的。

以上是我的个人愚见,我也欢迎大家给我留言讨论和交流。下面是我给各位的新年祝福
——————– 华丽的分割线 ——————–

徐诺:哥们,你是个非常不错的小伙子,也就是今天咱看了RUBY入门编程突然由徐诺想起了国之源公司,才有了上面的文章。哈,哥们咱一个人在公司都没有一个一起喝咖啡的人了,最近更是获得了“奶茶叔叔”的称号,o(︶︿︶)o ~~~~~~~~~岁月催人老啊。如果将来有幸我们还能同事,哥一定出资去买个咖啡机,咱一起装B做文艺小青年。

昱哥:不知道昱哥的头发张长了没有。

杨老大:EasyTrac 最终还是没用上,o(︶︿︶)o 唉,倒是在Linux下把Trac给搭建起来了,不过很可惜,一直没用上。

雅姐:越来越可爱了,这小姑娘,你还让不让人活啊?

吸管姐:其实早上在食堂吃东西挺没意思的,好久没有听见那熟悉的吸管声了,哈,在公司我又认识了你们红图集团的一位PHP工程师哦。

小敏:o(︶︿︶)o 唉,这姑娘越来越有女人味了,你还让不让别的姑娘活????给你的HTML前端基础别荒废了,有空多把玩把玩,不管是在任何公司作为WEB设计师,设计风格肯定是有一定的局限的。既然是WEB设计师,肯定就会带有WEB的“工业性”,别忘了我教你的东西。

李福中:其实长沙程序员群里面有很多重口味的话题,有空多看看,最近约炮之风也带到的群里了。

张佩安:哥们,别拿你的手机乱刷了,要知道,哥我是花了80块用金卡刷机的代价的。

张总:有空其实咱还是可以好好聊聊。

春霞:o(︶︿︶)o 唉,不说什么了,蛋糕我吃了,要吃的话自己过来找我要吧。

最后希望大家龙年,工作顺利,龙腾四海,龙马精神,龙的传人。。。。。。。。。

(二零一二年一月二十三日晚,十点二十四分)

html5 canvas 研究笔记(一)

最近公司开始折腾web game,正好可以接触和使用html5了,开始记录自己的Html5学习曲线。看了N多的帖子,发现自己早就拉后别人一大截了,T_T ~~~~~~~~~~~~

今天写的是一个简单的 Html5 游戏,也是参考了李松峰前辈的博客写的,有兴趣的同学可以移步李松峰前辈的博客

好了,话不多说,今天做的是一个非常简单的功能。在画板上把图片画上去。

代码如下:

(function(){
	var x=y=0;
	var xDirection = 1;
	var yDirection = 1;
	var image = new Image();
	image.src = "jsplatformer1-smiley.jpg";
	var canvas = document.getElementById("canvas");
	var context2D = canvas.getContext('2d');
	//画图函数
	var drawImg = function(){
		clearCanvas();
		context2D.drawImage(image,x,y);
		//边界值判断
		x += xDirection;
		y += yDirection;
		console.log("xpoint is:"+x+",ypoint is:"+y);
		//判断画板边界值
		if(y>canvas.height-150){
			yDirection += -1;
		}else if(x>canvas.width-150){
			xDirection += -1;
		}else if(y<0){
			yDirection += 1
		}else if(x<0){
			xDirection += 1;
		}
	}
	//清理画布
	var clearCanvas = function(){
		context2D.clearRect(0,0,canvas.width,canvas.height);
	}
	//初始函数值
	var init = function(){
		window.setInterval(drawImg,1000/800);
	}
	init();
})();

其中,context2D.clearRect(0,0,canvas.width,canvas.height);  这个方法用于清空画板,众所周知,在 Html5 中是没有动画这个概念的,动画都是基于原始的帧在界面上的模拟。这个方法在动画的应用中是随处可见。也是画板的常用方法之一了。赶快更新代码来试试吧。

WAP移动网站开发HTML入门

移动互联网被称为“第五次科技革命”,而随着iPhone和Android等智能手机的日渐流行和iPad等平板电脑的出现,移动互联网的潜力和趋势也愈发显现,针对移动设备的网站开发越来越受到关注,国内很多公司也开始重视面向所有移动设备的网站开发。

一般来说,对于移动网站可以采取两种方式:

  • 专门开发一个独立的移动版本
  • 使用media type和media query控制网站在移动浏览器的样式表

移动网站标记语言的演进

这张图形象的展示了标记语言的发展历程,包括移动网站标记语言。

移动网站开发要比普通的网站开发复杂的多,选择一种用于移动网站的标记语言同样相当纠结。

在最初,WAP论坛(后来和NTT合并,组成OMA,Open Mobile Alliance)创建了一种基于XML的语言,称为WML,这是用于WAP网站的标记语言。它并不是理想的方案,因为它将网站分割为两部分:普通页面使用(X)HTML,而移动网站使用WML。网站开发者想要做一个移动网站也不得不学习一种新的语言而不是转换技术,“一站式”的信条也被打破,用户不能访问他们喜欢的网站并且不得不发现这个网站的WAP版本——如果它们存在的话。另外日本的NTT创建了他们自己的语言cHTML(compact HTML),但是它并不能与XHTML和WML兼容。

由于这与理想中的方案相去甚远,W3C创建了XHTML Basic 1.0。正如其名,这是一个XHTML 1.1的子集。由于XHTML 1.1将XHTML改善为小型的模块,一个子集就可以只包含一些必须的或者可以在低端移动设备上控制的基本的模块、元素和属性。

Read more…

关于WEB前端开发字体的应用

背景介绍:传统的WEB应用字体是网站的主体,设计师的角度是一个艺术性的东西,但是在传统的WEB应用中,会有很多设计上的限制。今天主谈的就是网页中字体的使用。前端开发工程师或多或少会碰见这样的问题;按钮,导航栏,甚至是栏目标题背景中有使用特殊字体,如:微软雅黑,华文细黑等其他艺术字体。那么作为前端开发工程师,原来能够使用1像素按钮背景平铺的图片,不得不把这些按钮连文字一起扒拉的切下来。图片的尺寸增大了。相应请求的时间也长了……

那么我们在传统的WEB应用中应该使用何种字体呢?

Arial与Helvetica / Univers并列为目前的标准无衬线字体(Sans Serif),字型依据Unicode标准包含多国语言文字在内。Arial比例及字重和Helvetica(mac上用的字体)极之相近 。

 

关于页面字体,我们建议大家使用如下字体

 

Arial,tahoma,verdana,simsun 都是客户端机器具备的字体。所以也就避免了因为客户端不存在某种字体导致界面使用系统默认字体破坏页面布局的情况。对于 simsun 字体,因为其字体的显示相对其他字体而言比较小。一般用于在首页,频道门户,CMS 这样的传统WEB应用中。它能够展示更多的文字信息。verdana字体相对其他字体的缺点就是在于其文字相对其他文字比较扁平,占用的文字位置比较多。一行能够显示10个中文字符的信息内容也许就只能显示8-9之间。Tahoma在中英文混排的时候表现最突出。间隔行高也一直。Arial则是中规中矩,它有一个缺点就是无法区分大写的“I”与小写的“L”。

我们建议设计师在设计的时候精良采用以上四种字体,避免生僻字体因为客户端没有字库导致不支持的问题。切图片来表达,始终是一个消耗性能的事情。如果能够在前期和设计师有一个约定,减少前端实现的成本,那又何乐而不为呢?

发个轻松的帖子《程序员装B指南》

一、准备工作
“工欲善其事必先利其器。”

1.电脑不一定要配置高,但是双屏是必须的,越大越好,能一个横屏一个竖屏更好。一个用来查资料,一个用来写代码 。总之要显得信息量很大,效率很高。

2.椅子不一定要舒服,但是一定要可以半躺着。

3.大量的便签,各种的颜色的,用来记录每天要完成的事务,多多益善。沿着电脑屏幕的边框,尽量贴满,显出有很多事情的样子。

4.工具书,orelly的,机械工业,电子工业什么的都可以,能英文就英文,不行影印版的也可以,反正越厚越好,而且千万不要放在书架上,一定要堆在桌上,半打开状。

二、从进门开始
1.着装!着装!不管你是去实验室,或者去公司的大楼,在或者是小公司的民宅,或是自己创业的黑作坊;无论是春夏秋冬白天晚上刮风下雨电闪雷鸣台 风龙卷风,一个装b的程序员都要十分在意自己着装!这里只提出参考建议。初级装:衬衣+牛仔裤+休闲鞋。中级装:T恤+宽松短裤+拖鞋。高级装:背心+宽 松大花裤衩+人字拖。

2.得体的举止。在走廊以及任何形式的过道里,一定要双手插兜,走得像个痞子,至少要看起来有点反社会,如若不行,可走文弱天才型geek路线。。 Read more…

移动开发 viewport 介绍

<head>之间引入
<meta name="viewport" content="initial-scale=1.0, width=device-width, height=device-height,
minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

其中:
width - viewport的宽度 height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放

10个最好的移动Web应用开发框架

Sencha Touch Framework

Sencha Touch 是世界上第一个基于 HTML5 的移动 Web 开发框架,支持最新的 HTML5 和 CSS3 标准,全面兼容 Android 和 Apple iOS 设备,提供了丰富的 WEB UI 组件,可以快速的开发出运行于移动终端的应用程序。

10大优秀的移动Web应用程序开发框架推荐

jQuery Mobile

jQuery Mobile 框架把“write less, do more”精神提升到更高的层次。jQuery 移动框架可以帮助你设计一个可运行于所有流行智能手机和平板平台的应用程序,而不需要为每种移动终端都开发一个特别的版本。

10大优秀的移动Web应用程序开发框架推荐

jQTouch

jQTouch 是一款 jQuery 的插件,用于手机上实现动画、列表导航、默认应用样式等各种常见UI效果。支持 iPhone、Android 等手机。

10大优秀的移动Web应用程序开发框架推荐

The M Project

The-M-Project 是一个包含各种UI组件,基于 jQuery 开发 HTML5 应用程序的移动Web应用框架,支持 iOS、Android、Palm webOS和BlackBerry 等平台。

10大优秀的移动Web应用程序开发框架推荐

DHTMLX Touch – HTML5 JavaScript Framework for Mobile

DHTMLX Touch 是一个基于 HTML5 的免费 JavaScript 库,用于构建跨平台的移动 Web 应用程序。这不只是一组UI部件,而是一个完整的框架,它允许你为手机等触摸设备创建强大的Web应用程序。

10大优秀的移动Web应用程序开发框架推荐

WebApp.Net

WebApp.Net 提供了很多的 API,因此可以帮助你节省很多工作了。不需要花时间去进行 Ajax 调用的编码,因为已经内置了,另外还有很多其它内置功能,提供了详细的文档和应用演示。

10大优秀的移动Web应用程序开发框架推荐

Wijmo – jQuery UI Widgets

Wijmo 混合了 JavaScriptCSS3、SVG 和 HTML5,拥有30多个组件,是 jQuery UI 的一个扩展。

10大优秀的移动Web应用程序开发框架推荐

960 Grid on jQuery-Mobile

jquery-mobile-960 是一个用于移动 Web 开发的网格框架,综合了 960.gs 的灵活性和 jQuery Mobile 的方便性。它的目的是让 jQuery Mobile 布局更加的灵活,使得应用应许在移动终端更加易用。

10大优秀的移动Web应用程序开发框架推荐

SproutCore HTML5 Application Framework

SproutCore 是一个 HTML5 移动 Web 开发框架,它的目标是在无需浏览器插件的情况下,在浏览器中位应用程序提供极佳的桌面效果。

10大优秀的移动Web应用程序开发框架推荐

NimbleKit

NimbleKit 是为 iOS 设备构建应用程序最快速的方式,你不需要知道 Objective-C 或者 iOS SDK,你只需结合  JavaScript 代码编写 HTML 页面就可以了。

10大优秀的移动Web应用程序开发框架推荐

45个关于移动网络设计与开发的实用指南

Ubuntu 中无法访问 Gmail 的解决办法

咩得说,肯定又是某党做的好事,把这个添加到 HOSTS 文件中,搜的一下就打开了。

Ubuntu 修改命令 sudo gedit /etc/hosts

添加如下服务器到最后一行。

203.208.46.146 www.google.com
203.208.46.147 www.google.com.hk
203.208.46.132 clients1.google.com
203.208.46.146 m.google.com
203.208.46.149 mail.google.com
203.208.46.149 smtp.google.com
203.208.46.149 imap.google.com
203.208.46.149 pop.google.com
203.208.46.161 chatenabled.mail.google.com
203.208.46.161 mail-attachment.googleusercontent.com
203.208.46.146 id.google.com
203.208.46.146 encrypted.google.com
203.208.46.161 encrypted-tbn0.google.com
203.208.46.162 encrypted-tbn1.google.com
203.208.46.163 encrypted-tbn2.google.com
203.208.46.164 encrypted-tbn3.google.com
203.208.46.132 webcache.googleusercontent.com

搞定收工。

 

 

移动互联网开发初体验

终于我也涉足了移动互联网的开发。在开发的一周,接触了很多优秀的国外案例,包括视觉设计,体验设计,框架设计。总的来说,支持了HTML5,CSS3的移动平台,给我们带来了很多不可思议美妙的编程体验。

总的来说:现在移动平台的开发环境,等于普通 WEB 开发的难度(兼容性,跨浏览器等等BUG)乘以 1000 就是现在移动平台开发的现状。单纯就 IPHONE 而言,固定的硬件尺寸,优秀的硬件支持,以及WEBKIT核心的浏览器搭载,注定其在WEB领域带来的优秀浏览体验。POP,TIP,SILDER各式各样的特效在其上面的应用也是得心应手。对浏览器浏览的流畅性远远优秀于ANDROID。本人的手机(HTC G1)也是各式各样浏览器测试的成员。对 JQUERY MOBILE,WINK,SENCHA,DOJO 等一线开发的 MOBIEL 框架以及DEMO试运行。其结果是惨不忍睹。一周以来,总结了如下几条经验。

  1. 请抛弃传统WEB的制作流程和理念,很多理念在MOBILE上的应用,是需要斟酌和重新考虑的。
  2. 请尽量,尽量,尽量不要使用图片以及任何动画特效,在ANDROID平台上的机器,很多是没有强悍的CUP和内存来支持如此大的开销的。
  3. 对于界面设计尽量简单话,多使用CSS3来实现界面布局,比如圆角,文字阴影,元素模糊效果,渐变色等等设计上需要的基础元素在MOBILE平台上都有很好的支持。还是那句老话:“ SIMPLE IS COOL”。
  4. JavaScript DOM EVENT 等很多 JS 上的模型在MOBIEL上都发生了一定程度的变化。(需要恶补MOBILE开发JAVASCRIPT知识了)

接下来的文章,我们来一个简单的DEMO,一起进入 MOBIEL 开发的领域吧。(未完待续)

Go back to top