微軟的IE9 Hackathon遊記

這裡禮拜六受到ericsk的邀約，參加了由台灣微軟舉辦的IE9 Hackathon，在這裡跟讀者說聲抱歉m( _   _ )m，NPNT（No picture, no talk）的概念我也是懂的，但是實在是忙到沒時間拍照，身為一個隨時帶著智慧型手機的人卻不好好使用照相功能，我會好好檢討的。

這時候你一定會有一些問題？你不問我就自己問了！



什麼是Hackathon（黑客松）？
Hackathon是一個被資訊圈人士創造出來的複合字，來自於Hacker+Marathon，意思就是馬拉松式的黑客活動，簡單來說，就是一群人聚在一起，然後熱血的coding！

什麼是IE9 Hackathon？
我想每一個人一開始看到IE9黑客松的時候一定會產生這樣的疑問吧？什麼是IE9黑客松，可以吃嘛？是不是要寫IE9的插件？我不會.Net，怎麼辦？

但其實事情不是這樣的，有好好閱讀報名網頁的人就會發現，IE9黑客松，是一場名符其實HTML5黑客松，活動的內容就是針對主辦單位公布的主題做出一個和HTML5相關的作品，並在活動的結尾用微軟最新的Internet Explorer 9做一個demo和講解一下自己寫的code，評分則是有所有參賽者互評，所以是場公正公開客觀的比賽。

我需要會HTML 5才能參加嘛？
我覺得這個問題的答案見仁見智，不過我覺得只要有心，一定是沒問題的。（這什麼古板爛答案，從電影台詞中抄來的嘛？）我在某人的網誌看到這麼一段話，我覺得很重要也很感同身受，所以我決定分享一下：

身為一名優秀的資訊人員，Pick up技術一定是很快速的。

所以其實是可以到現場來現學現賣的，不過鼓勵大家還是在來之前先預習一下，因為比賽的時間有限，雖然看似很長（早上十點到晚上五點），但其實因為食物的誘惑，或是Facebook的依依不捨，再扣掉午餐和嘴砲時間，其實寫程式時間不算很長。

活動實況
好了扯了前言一堆，該開始轉播一下實況了！這次的主持人其實也不是ericsk，雖然他還是有來現場坐鎮。主持人是Gamebase的Tony，上次IE9黑客松的冠軍，我覺得這是一個蠻特別的感覺，由上次參賽的冠軍來作為活動主持人。

接下來開始自我介紹，參加的人感覺上幾乎都是已經在業界工作的人士，加我算起來也只有三名大學生，這次比賽總共有十六個人。中華電信首當其衝，來了四到五人，大概都是因為某人來的吧XD，然後還有一些TrendMicro，剩下的我回想不起來了。總而言之都不算是小咖就對了，那我要怎麼辦？只好講個我寫過很多很多Helloworld來跟他們的經歷抗衡一下！

這次的題目有兩個，一個是CAPTCHA，另外一個是賽車遊戲，CAPTCHA基本上很簡單，就是一般我們在填寫網頁表單會遇到的驗帳碼驗證機制，我們必須以HTML 5的方式去實作一個。賽車也是差不多的狀況，就是寫一個賽車遊戲。所以在題目方面，大概是HTML 5的canvas或是SVG，

一開始Tony講完題目沒多久後，大家只花一下子的時間就很進入狀況了，所以現場一直變得很安靜，不過值得一提的時候左後方，大概ericsk的附近，一直有點騷動，他們好像寫很快！感覺可能很有經驗吧，把一些寫過的東西給拉進來用。

我今天的狀況有點怪怪的，一直有點恍神，大概是因為期中考剛考完，所以有一點睡眠不足，從我話講有點少就可以看出來了。所以一開始寫程式碼都卡卡的，所以花了比較多的時間在pick up HTML 5的drag and drop部分。

一開始的主意是想，做個拖拉介面方式的驗證碼，先告訴你驗證碼，然後請使用者拖拉正確的方塊到指定區域來達成驗證，這個主意很可惜的在下午兩點多宣告放棄，一是我從十一點開始就卡在drop event的binding，其他的event都綁的上去，偏偏drop不行，不知道是不是什麼了細節，因為我是先在Mac上用Coda開發，用Chrome預覽的，所以並不是IE9的問題。

後來大約三點我就開始著手於另外一個想到的計畫，既然主題是賽車和驗證碼，那我們就不如讓驗證碼賽車吧！所以我做了一個應用程式，讓四個隨機字母去賽跑，誰先到終點就先輸入。在寫個這個程式的時候已經三點多了，而且我現在才開始用到canvas，剛剛那個程式還沒到用canvas地方就掛了，眼看五點的deadline在即，整個腎上腺素都一擁而出，很難想像在兩個小時內我居然可以完成這個程式。

值得一提的是，IE9的對於HTML5的相容性真的不是普通的讚，整個顛覆了以前我對IE的印象！我在Mac下只用Chrome預覽過的程式，本來想說拿到IE9來開還需要改很多bugs，結果

根本不用改！

IE9非常順暢的執行了我的程式，非常感謝IE9，提供了這麼棒的相容性，要不然我今天大概是無法上台demo了。

最後的demo才是重頭戲，大家都非常的有創意，而且很多人也都想到了把驗證碼和賽車結合在一起，印象比較深刻的是非常數學的談話，身為一個念過數學系的人其實也聽不懂他們在討論什麼東西，不過那個ericsk的同學的程式碼讓我非常印象深刻，因為跟我以前在寫一大堆矩陣轉換的時候的程式碼很相似，勾起了我的回憶XD。

可惜的是最後獎品都被中華電信的人拿走了，在我demo的時候我看大家都笑的那麼開心，很像在看賽馬的時候，有那麼一絲絲的希望覺得我搞不好有機會沾個第三名抱走一台XBOX 360+kinect，我自己本身是不玩的，不過我聽說kinect對中風的人復健效果很好，本來想贏一台回去給老爸復健用的: (孩兒不肖，爸爸對不起。（話說打這篇網誌的時候，我爸坐在我旁邊）

附上作品的照片：

作品連結：http://goo.gl/FrxuO

不過最後還是有拿個第六名，四到七名的獎品是jQuery實戰手冊第二版，不過我已經在OSDC2011的時候沾ericsk的光拿過了，所以ericsk改送我「約耳談軟體」，在回淡水的路上看了一下，這本書蠻有趣的！雖然翻譯爛爛的，但是感覺的出來作者蠻有趣的，裡面講到一些實際工作上會遇到問題也很值得學習，對我來講這本書的價值遠超過XBOX 360，所以也還算不錯啦！

結論：

• IE9真的很不錯，微軟新救星，希望大家趕快棄IE6改用IE9。
• IE9不支援Web application API很可惜，不過微軟的觀點也沒錯，有些還沒完整規範的東西實作出來是會需要花很多功夫改的。
• 微軟的公司地點真的不是很好找，居然藏在國泰金融中心裡面，害我一開始在外面打轉了一下。
• Hackathon真的是一個很好玩的活動，很難得有機會可以這麼focus在寫程式上頭，以後要多參加！
• 謝謝微軟提供很棒的伙食，不但有很多零食、飲料，下午還有五十嵐、星巴克、炸雞，唯一美中不足的是中午的午餐，上次聽說是鼎泰豐，這次的午餐真的遜色很多。
• 微軟的妹真的很正。（聽說是XBOX妹）