做最好的中文Web工具，提高工作效率
利用業(yè)余時(shí)間跟朋友一起做了一個(gè)網(wǎng)站：http://www.chinacxy.com，這是一個(gè)工具性的網(wǎng)站，主要針對(duì)web開(kāi)發(fā)工程師。經(jīng)過(guò)斷斷續(xù)續(xù)的改進(jìn)，現(xiàn)在終于可以向大家介紹推薦了。我們的目標(biāo)，做最好的中文web工程師工具，提高前端開(kāi)發(fā)者的工作效率。
因?yàn)樽约阂彩荳eb開(kāi)發(fā)者，有時(shí)要用到一些工具，但在網(wǎng)上總是找不到滿意的，并且很分散，滿屏的廣告，因此產(chǎn)生了自己開(kāi)發(fā)的想法，于是遂跟一位朋友一起開(kāi)發(fā)了此站。對(duì)于網(wǎng)站上放廣告問(wèn)題，我不反對(duì)，因?yàn)榫W(wǎng)站畢竟有運(yùn)營(yíng)成本，但一定要有個(gè)度，不能讓廣告影響到了用戶的使用。
另外，這此工具都很常用，大家都可以在別的網(wǎng)站上找到，所以每個(gè)工具都有“山寨”的嫌疑，喜歡用的朋友就用，不喜歡的不勉強(qiáng)。
下面就分塊來(lái)介紹一下目前具備的功能。
網(wǎng)頁(yè)特效
先上圖吧：
做這個(gè)功能的目地是收集一些比較網(wǎng)頁(yè)特效。目前收集的還不多，我們會(huì)慢慢增加。另外大家可以對(duì)認(rèn)可的效果進(jìn)行投票，評(píng)論。
后面會(huì)考慮把此功能向廣大web開(kāi)發(fā)者開(kāi)放，讓開(kāi)發(fā)者可以上傳自己的作品。
正則表達(dá)式
效果圖：
本工具提供了正則在線運(yùn)行和替換功能，并對(duì)結(jié)果進(jìn)行了高亮。
另外，為了方便大家使用，提供了一些常用的正則表達(dá)式，當(dāng)然，這些正則只是根據(jù)個(gè)人知識(shí)和互聯(lián)網(wǎng)上的進(jìn)行整理的，由于個(gè)人水平有限，不保證絕對(duì)正確。大家如果發(fā)現(xiàn)有誤請(qǐng)給我留言或在網(wǎng)站的“關(guān)于”頁(yè)面反饋。
CSS/JS/HTML格式化
效果圖：
本工具主要提供了代碼格式化功能，大家把代碼復(fù)制到文本框內(nèi)即可，程序可以自動(dòng)識(shí)別處理。
本工具的html和javascript部分用了beautify.js，CSS部分是朋友寫(xiě)的JS，大家在使用過(guò)程中如果發(fā)現(xiàn)bug請(qǐng)記得反饋哦:)。
JSON格式驗(yàn)證
效果圖：
這個(gè)工具是某個(gè)用戶反饋建議增加的功能。
本工具主要是對(duì)json格式進(jìn)行格式化和驗(yàn)證，大家可以對(duì)ajax里提交或返回的JSON格式進(jìn)行驗(yàn)證。
在線編輯代碼
效果圖：
為了頁(yè)面空間更大，這個(gè)頁(yè)面跟其他頁(yè)面風(fēng)格不同哦。
這個(gè)工具是看到園友在博客里發(fā)了一個(gè)HTML5所見(jiàn)即所得在線coding的工具后加上去的。
顏色選擇器
效果圖：
這個(gè)工具的功能很簡(jiǎn)單，就是選擇一個(gè)顏色，可以得到rgb的值。
自己PS一下，這是我覺(jué)得所有功能中最差的一個(gè)，正考慮是否去掉，大家可以在評(píng)論中給出自己的意見(jiàn)哦。
圖片base64編碼工具
效果圖：
這個(gè)工具就是把圖片轉(zhuǎn)換為base64格式，一個(gè)偶爾會(huì)用到的小功能，昨晚才上線的:)。
當(dāng)然，這個(gè)適合較小的圖片，像圖中產(chǎn)生的base64字符串這么長(zhǎng)就不合適，會(huì)導(dǎo)致CSS文件很大。
jscode.chinacxy.com
效果圖：
這是一個(gè)獨(dú)立的子站，第一眼看上去這個(gè)跟國(guó)外的jsfiddle.net網(wǎng)站基本一樣，大家先別急著罵我山寨，我說(shuō)說(shuō)這個(gè)工具的由來(lái)。
我個(gè)人非常喜歡jsfiddle.net這個(gè)網(wǎng)站，但在使用過(guò)程中發(fā)現(xiàn)這個(gè)網(wǎng)站有一個(gè)讓人很抓狂的bug，就是在右邊的幾個(gè)面板中有時(shí)不能輸入中文，另外由于在國(guó)外，有時(shí)打開(kāi)速度很慢，甚至有時(shí)會(huì)打不開(kāi)。我們?cè)谶@個(gè)網(wǎng)站github主頁(yè)提交過(guò)這個(gè)bug，但作者回復(fù)說(shuō)這是其中一個(gè)JS庫(kù)(codemirror)的bug，下一版本沒(méi)計(jì)劃修復(fù)此bug。
也許是這個(gè)網(wǎng)站大部分都是國(guó)外用戶吧，英文輸入不存在這個(gè)bug，在忍無(wú)可忍之下我們就自己開(kāi)發(fā)了一個(gè)這樣的網(wǎng)站。第一版的目標(biāo)就是山寨jsfiddle.net的主要功能，修復(fù)中文不能輸入的bug，但因?yàn)橛玫氖莿e人的庫(kù)，在IE下還是有此問(wèn)題，大家在使用時(shí)可選擇較新版的Chrome或FireFox。
后記
我們開(kāi)發(fā)這樣一個(gè)工具型的網(wǎng)站僅僅是想方便web開(kāi)發(fā)者，提高大家的工作效率，得到大家的認(rèn)可。我們非常希望得到大家的意見(jiàn)和建議，請(qǐng)看到此文的用戶不吝留下您的看法。
原文鏈接：http://www.cnblogs.com/jscode/archive/2012/06/08/2541210.html
【編輯推薦】
