bitbucket和github的简单比较

我本身比较偏爱Python,以及用Python所写的分布式版本控制工具 Hg
曾经的Git让我倍感挫折。
好在现如今已经有了 TortoiseHgTortoiseGit
对于那些熟悉乌龟 svn 的人来说是个福音。

先前由于比较熟悉hg,所以一直用 Hg 界内流行的代码托管网站 bitbucket.org
最近又重新体验了一把(去年体验过,倍感受挫) Git 界流行的 github.com,感觉很是舒爽。
于是简单的对比了两个网站。
这两个网站有很重要的特点,是社区化。
你可以follow你所关注的人和项目。这点让人觉得很有趣。
虽然 Google Code 也已经支持 Hg 代码托管,然而显得严谨了,
所以我没使用过hg版,只用过svn,故不参与比较。

bitbucket 和 github 的比较
bitbucket.org github.com
免费仓库个数 无限
HTTPS推送 √ 便捷 我从没有成功过 *
免费套餐容量 √ 1GB 0.3GB
私有仓库 √ 无限! 没有
最便宜套餐 √ $5/month $7/month
二级域名个人主页 ** √ 即时完成 等待10分钟
域名长度 较长 √ 较短
域名记忆难度 较困难 √ 较简单
代码片段工具 Gist
界面语言 只有英语 √ 有简体中文
界面美观度 *** 一般 √ 美观
中文社区活跃度 未知

* github貌似是支持https推送的,但我总是失败,只能导入key后通过ssh提交。
** 你只需要在各自的仓库中建立一个名为 username.bitbucket.org 或 username.github.com 的代码仓库即可
*** 美观度什么的个人观点,请勿拍砖

两个网站真是平分秋色,各有各的好。
bitbucket 的硬实力更棒,而 github 的软实力更强。
具体用哪个呢,自己分析下自己的需求吧。

欢迎留言,好更新或完善一些比较的条目。

基于SQLite的短网址工具——SQLito

今天晚上没事,花了两三个小时时间写了一个基于 SQLite 的短网址工具。
有这个想法很久了,之前网上找的一堆短网址工具基本都要求mysql,
而我又很不喜欢mysql,动用mysql很麻烦,总是要建账号之类的。
所以就自己写了一个基于SQLite的,想必会有一些朋友更我一样喜欢的东西吧。。

完成了核心内容,美化什么的懒得弄了。自己用用不管漂亮与否了。
这一刻我完全不是做前端~
SQL防注入什么的也懒得弄,大家随意就好。
可以缩短网址,可以列出缩短的网址有哪些,还可以通过书签栏缩短网址。
简单的统计访问人数等。

项目我放在bitbucket上,点击查看SQLito
可以直接下载最新镜像 SQLito

这个需要服务器支持sqlite3,第一使用的时候会提示创建数据库。
所有文件扔到服务器上后,可以先修改config.php文件,不改也没关系
可以改动的是路径,如果自动获得的路径不对的话,就自己填一个,要以/结尾。
还有就是数据库名,也可以自己改。

然后修改.htaccess文件,增加下面的规则。
或者直接用附带的.htacess即可。

RewriteEngine On
RewriteRule ^([0-9a-z]+\-?)$ ?q=$1 [L]

之后就可以通过 add.php 来缩短地址
add.php 里边还有一个可以拖到书签栏的小工具,平时我就用他啦。

如果你不想让人使用缩短功能,那就自己改一下add.php文件好了。

通过 list.php 来查看有哪些被缩短过(现在我翻页都还没做呢~)
点击时间可以查看详细信息。

另外,在短地址后面加上一个减号可以预览地址。

测试地址: http://g.shawphy.com/
这个地址有效期至 2010-8-31
仅供测试,由于测试阶段,所以数据库会时不时的清空掉的,请勿用于正式的缩短网址工具之用。

P.S. PHP的函数太TM丰富了,base_convert函数非常好用。我用它实现10进制到36进制转换。

修复编码问题,如果最开头不是以http|https|ftp开头则自动加上http。

新增了查看详细详细统计信息,新增附加减号可以预览地址的功能。

Windows下用SSH公钥验证实现免密码登陆(图文教程)

我使用的是PuTTY客户端,所以这里介绍PuTTY的设置。

首先下载工具,访问PuTTY的下载页面,下载PuTTY和PuTTYgen这两个工具。
如果你使用TortoiseGit的话,其bin目录中已经有这个工具了,可以直接使用。

打开后会出现如图所示:

点击其中的Generate,然后按照文字提示,
在空白处随机移动鼠标以生成随机数(真是天才的想法)。

生成后如图所示:

随后的Key comment一栏爱改不改,我简单改了一下。
然后点 Save private key 按钮保存密钥,他会问你是否不设置密码短语保护私钥,
点yes,就可以了。我保存到了D:\id_rsa.ppk

接下来需要通过普通的SSH方法登陆你的服务器,
把 Public key for pasting into OpenSSH authorized_keys file 栏中的内容
放到 ~/.ssh/authorized_keys 文件中
据说设置权限比较好: chmod 600 authorized_keys

接下来是设置PuTTY。先填好Host Name,我这里设置了shawphy.com

然后到Connection -> Data 里的 Auto-login username 填好你的用户名,我的是shawphyc

接着到Connection->SSH->Auth 中的 Private key file for authentication ,选择你刚才保存的那个ppk文件。

最后回到最上面的Session在下面的Saved Sessions里输入名字后,点Save就可以了。

以后每次双击这个就能登陆了。

最后,附加一个小功能,Connection->SSH->Tunnels中,填个端口号,比如7070,下面选择Dynamic,然后Add之后,就可以那啥了。

选择带有多个class的元素

今天收到读者来信,询问如何选择如下的元素
<div class=”good list Card”></div>
这里有个特征,就是需要选择同时带有这几个class的元素。
或者也被误认为选择一个带有空格的class。

经过测试,使用选择特殊的转义符号来做

$(“.good\\ list\\ Card”)

这个只有IE6下能成功。(我仅测试了IE6,Firefox 3.6.8和Chrome 6 dev)
推测原因是因为先进的浏览器中jQuery是直接调用getElementsByClassName,
而这个浏览器方法是不支持带空格的class的,他会认为是多个class。
而IE6之所以成功,是因为本身就不支持getElementsByClassName,
所以jQuery内部是遍历了所有元素,
得到class属性值是“good list Card”的元素。

解决方案有两种:
逐个过滤,先找到带有good的元素,
然后从中筛选出带有list的元素,最后筛选出带有Card的元素:

$(“.good”).filter(“.list”).filter(“.Card”)

或者让先进的浏览器也跟IE6一样,直接通过属性选择器:

$(“[class=’good list Card’]”)

测试了一下性能,根据多class测试显示,后者的性能显著的好于前者。
因此推荐使用后者,不论从易读性还是性能上都高于前者。但Cloudream在评论中指出,后者的问题是class的顺序不能变。
附:
要选择其他带有特殊字符元素,参考用jQuery 选择器选取包含特殊字符的元素

经Cloudream提醒,直接用 $(“.good.list.Card”) 即可。
测试下来,除了IE6中,其余两个浏览器中这种方法都小胜第二种方法。

Merpressor —— 自动合并压缩JS文件

略据有规模的网站都会有合并js/css文件的需求。
这里推荐PPTV同学做的一个合并js和css文件的方案:Merpressor
项目代码托管在google code。

Merpressor的作用很简单,如果你本地开发的时候有一堆js文件,比如
yui.js
selector.js
dom.js
user.js
my.js
….

然后最终自动合并成一个你想要的文件,比如test.js

页面中只需要引入这个test.js就可以了。
本地为了方便调试,test.js里通过document.write来引入其他js文件,
而远端服务器上则直接就是合并压缩后的单个文件了。

我看下来感觉还不错。只是觉得服务器端必须部署java服务器有点要求比较高。
对于有分布式版本控制工具,如hg/git等,在本地测试完成后push到服务器端,
并让服务器端执行一个hook程序,pull 并 update 后执行压缩,这样对系统的部署要求可以低一些。
不过对本身版本控制工具的要求就会高一点了。所谓各有优势。

SAXON 处理 XSLT 2.0 文件

这几天在重新写jQuery新的文档。由于新的jQuery API的xml结构发生了巨大变化,另外已经使用了XSLT 2.0的功能。而目前没有浏览器支持XSLT 2.0,因此打算不再使用单文件的xml版,而是直接通过SAXON生成多文件的HTML,并且基于此还可以很方便的输出CHM文件。

本来使用的是Python的lxml库,但是苦于不支持XSLT 2.0,后来尝试使用微软的命令行工具msxsl.exe,但由于MSXML本身不支持XSLT 2.0所以也只能作罢。最后找到的是SAXON,有Java版和.Net版,基于MPL开源的版本,用起来很趁手。

另外,关于新jQuery文档何时发布,我也不确定,应该这个月内能发布吧。尝试新技术总是让人兴奋的~

显示一些如title/meta之类的特殊元素

title代表的是页面的标题,很多时候跟h1的内容是一样的。
我在写页面的时候感觉总是重复一次很麻烦,
于是就索性把h1给删了,把title给显示出来参与页面布局,
这样整个页面就有趣多了
代码很简单

head,title{display:block;}

是的,只有一句话,让head和title都显示。
此外如果还对其他有兴趣,可以把meta、script还有style等都显示出来

另外,下面这句也会很有趣

body style, body script{
display:block;
white-space: pre;
}

可以让body中的script何style都原样显示出来,
怎么用好就靠大家自己发挥了。

当然,我们亲爱的IE6是不支持上面两个小功能的。
Firefox 3.6.6 和 Chrome 6.0.458.1 测试通过。

自动刷新浏览器 for IE 的脚本

上回说到,可以设置好编辑器,让编辑器保存的时候自动生成文件。
对于firefox已经有一个扩展了,而对于ie则没这么容易了。
庆幸的是,我测试IE6通常是在虚拟机里的。这就带来了极大的便利。具体方法是:

  1. 虚拟机中共享一个文件夹
  2. 让编辑器在保存时在那个文件夹中写入文件
  3. 在虚拟机中允许一段脚本来检测文件
  4. 如果检测到文件,则刷新浏览器,并删除文件

具体的脚本如下,保存成vbs文件即可。

var WshShell = WScript.CreateObject(“WScript.Shell”),
fso = new ActiveXObject(“Scripting.FileSystemObject”);
while(!(fso.FileExists(“c:\\tmp\\stop”))){
WScript.Sleep(100);
if (fso.FileExists(“c:\\tmp\\refresh.ie6”)) {
try {
fso.DeleteFile(“c:\\tmp\\refresh.ie6”);
}
catch (e) {
}
WshShell.SendKeys(“{F5}”);
}
}
fso.DeleteFile(“c:\\tmp\\stop”);

这段脚本的目的就是每0.1秒检测一下c:\tmp\下是否存在refresh.ie6文件。如果存在就发送F5来刷新页面。
如果存在c:\tmp\stop文件,则结束这个脚本。

这对于用虚拟机测试浏览器兼容性的开发人员特别有用。

groove边框的使用

最近一个项目中,迷恋上了groove边框。灰色的背景下使用这个边框看上去就好像是刻在金属上的感觉。再配合上text-shadow,文字也好像是蚀刻在金属上的了,我很喜欢。

点这里直接看demo
关键代码如下,我选用了Calibri字体,看上去实在一点。用其他字体效果就不会很好。
Update:经网友Sinina提醒,Tahoma也很有质感。上面的demo里我已经换成Tahoma字体了。Tahoma在各个平台下通用性更高一点。推荐优先考虑Tahoma。

body{
background: #ddd;
font-family:Calibri;
color:#444;
}
table{
border-collapse:collapse;
}
th,td{
border: 2px groove #fff;
text-shadow: 0px -1px #bbb,1px 1px #fff;
}
td:active{
border-style: solid;
border-color: #aaa #fff #fff #aaa;
}