2015 Hackathon 杭州站回顧之BugLife篇

BugLife的誕生記

先自我介紹下咱們團隊，Wellming、Bell orchid、Retamia，三枚程序員，主要技能點PHP，目前在一家棒棒的作開源網校系統(EduSoho)的公司Coding。第一次參加黑客馬拉松活動，沒啥經驗，本着來混吃混喝的心態，早早的蹦躂到了會場。實話說，本次參賽，是帶着公司的任務來的：物色人才。因此，一到會場就開始，微信搖啊搖，羣裏發發紅包，刷存在感！不過確實認識到一些頗有想法的Hacker，目前也正在轉化ing，嘿嘿...

接到題目「讓技術走進生活」後，咱們就開始想各類idea，咱們就想啊想啊，咱們作個啥，能改變下咱們程序員的生活呢？

• 程序員常常幹什麼呢？修Bug。

• 修Bug有什麼能夠改進的呢？公司的Bug系統很差用。

• 很差用在哪裏呢？報告BUG麻煩，Bug描述理解困難。

• Bug描述理解困難，爲何呢？由於是文字（貌似是因爲上傳截圖麻煩，因此都懶得貼圖）。

有了，咱們就作一個能很方便的貼圖報告BUG的工具，BugLife就此誕生了。

BugLife的開場白

程序員的一輩子，須要在不斷的消滅BUG中度過。一款高效的Bug追蹤系統，對提升程序員的生活幸福指數是頗有必要的。BugLife就是這麼一款Bug追蹤系統，她：

• 經過截圖爲核心，清晰明瞭的描述BUG；

• 經過ctrl+c, ctrl+v就能快速添加BUG；

• 經過簡單的鼠標、快捷鍵操做，就能完成BUG的認領、修復、驗證等狀態變動操做。

BugLife的實現

考慮到時間因素，咱們沒有采用高大上的ReactJS來實現咱們的前端，而是採用了咱們相對較熟練的SeaJS+Arale+jQuery+Bootstrap的經典組合，來做爲咱們的前端方案。後端採用了一個PHP的微型框架Silex來作RESTFul API。

因爲Bootstrap的默認樣式比較齪，咱們引入了一個Bootstrap Material Design的樣式庫，一會兒，就讓咱們的BugLife高大上起來（見文章下面的截圖）。

Bootstrap也缺一些動效，咱們引入了Animate.css，給BugLife增添了活力。其餘還引入了Keypress、Arale Dnd庫，爲BugLife提供了快捷鍵、拖動等操做，提高了易用性。

通過接近15小時的熬夜奮戰，BugLife的核心功能開發完成。

BugLife的ShowTime

在showtime以前，爲了填充點演示數據，順手到活動主辦方的網站segmentfault.com上，抓了些BUG，記得有8個，雖都是些小問題，但也是Bug呀，要捉掉。今天我偷偷的去segmentfault.com上喵了幾眼，發現我捉出來的Bug，還沒被消滅掉，看來有必要發個郵件給高陽(Segmentfault CEO)了。

showtime咱們也是分工明確，我負責解說，Retamia和Bell orchid負責演示。3分鐘的演示時間，仍是很短暫的，多囉嗦了幾句，差點超時，還好隊友提醒及時，在超時前完成了解說。

咱們的BugLife獲得了2位評委老師的讚揚，認爲咱們的BugLife很輕量，戳中痛點，很適合敏捷開發的團隊使用，但願咱們能繼續開發下去，或者開源，他們來繼續作下去。這裏向確定咱們的評委老師表個態，咱們確定會繼續開發下去的，也會基於新的技術來重寫咱們的BugLife，讓BugLife更健壯。但目前代碼自認爲還比較齪，不能表明咱們的真實水平，雖代碼已在Github上公開，但很差意思放出來。哈哈。

還獲得了高陽的飯約，由於咱們捉了好幾個segmentfault的bug，高陽你別忘啊！

下面就上幾張咱們的BugLife的靚照吧：

BugLife的獲獎

自showtime以後，咱們仍是頗有自信能得個獎的。不出所料，BugLife拿了個三等獎，哎呦，還不錯哦！感謝評委老師，感謝主辦方。贏了個Kindle+1024元現金，咱們現場就瓜分，人均660元收入。

BugLife的後記

咱們會基於React、Flux來重寫咱們的BugLife，也會融入一些敏捷開發的實踐，作一個輕量級的、易用的Issue Tracker。

最後，打個廣告，歡迎加入咱們，一塊兒作國內最好的開源網校系統EduSoho ，這裏是咱們的招聘主頁，謝謝你們。