發表文章

目前顯示的是有「自由軟體」標籤的文章

Koa 2 起手式!

圖片
在 Node.js 的世界裡,說到今天最潮的 Web Framework,肯定就是 Koa!其用了最新的 JavaScript 語法和特性,來改善 Web Framework 的設計。只不過,Koa 雖然相對於其他舊的 Web Framework 來說有相當多的進步,但很多人卻相當討厭 Koa 的 Generator 設計,尤其是那些「*」符號,那不知所謂的 yield 也讓很多人不舒服。所以至今仍然有許多人在使用 express 來當作自己的 Web Framework,寧可繼續使用那老派的 callback 設計,而不肯嘗試 Koa。 隨著 ECMAScript 標準的進步,Koa 才剛被開發出來沒多久,原本的開發團隊就立即著手打造 Koa 2 ,開始更進一步採用更新的 JavaScript 特性,以 async/await 語法重新打造了全新且更簡潔的框架。可惜的是,由於 async/await 語法一直遲遲沒有被 JavaScript 引擎原生支援,因此總需要靠 babel 編譯打包程式碼後,才能正常跑在 Node.js 之上。這讓 Koa 2 一直無限期處於非穩定版,讓原開發者從開發的一開始,就打算等到 V8 和 Node.js 開始原生支援 async/await 後,才會被以穩定版(stable)的姿態釋出。 所以,即使 Koa 2 到了今天已經相當穩定,也開始有不少人使用在自己的線上服務,卻一直無限期處於非穩定版的狀態。 另外,由於 Koa 2 大量使用 Async/Await,如果你還對 Async/Await 的使用還不熟悉,建議在閱讀本文之前,先閱讀舊文「 JavaScript 好用的 async 異步函數! 」來學習如何使用。 學習 Koa 的好時機來囉 總算,日前 Node.js v7.6.0 釋出後已經正式宣布原生支援了 async/await 語法,而且不需要額外的參數選項。伴隨著這個消息,Koa 2.0 也隨即正式釋出了! Node.js 內建支援 ES7 的 async/await 真的是非常棒的消息!過去我們使用 async/await,都還需要 babel 的協助才能正常跑在舊版的 Node.js,不但開發上相當麻煩,非原生的各種 ES7 特性也浪費不少額外的記憶體和效能,這樣的問題在斤斤計較效...

MakerBoard: 自幹 MT7688 模擬器!簡報釋出!

圖片
使用 MTK LinkIt Smart 7688 這類開發板時,總是很痛苦,由於儲存空間不大,記憶體也不大,常常在開發的過程中飽受折磨。於是我們開始思考如何可以在自己的電腦上,模擬一個 MT7688 的環境,在有充沛資源的機器上進行開發。就這樣,前陣子開發了一個小小的 Open Source 工具專案「MakerBoard」,並在 MakerCup 的共筆網站發表「 沒有板子也可以玩的 7688 模擬器! 」。 雖然這樣一個小小的模擬器運用了 VM 和 Container 相關技術。但其實主要概念並不難,這次 5/10 在台大的開放原始碼課程中,就簡單從 MakerBoard 這專案出發,然後說明了一下怎麼樣自己打造一個簡單的 Container,並利用 QEMU 來進行 Binary Translation 的工作。 簡報釋出,請自行服用:

Lantern 專案:快速打造屬於自己的 Isomorphic 網站服務

圖片
話說,Isomorphic 一直是 Node.js 開發者的夢想,期望同一套程式碼前後端都可以使用,大幅簡化程式碼和加速開發。此外,動態網頁的 SEO 問題也可以同時獲得解決,許多效能問題也可以得到改善。但是,要實現 Isomorphic 的架構,有很多的問題得先解決,會花大量時間在前期工作上,往往讓許多開發者頭痛。 儘管頭痛,仍然阻止不了大家往 Isomorphic 的世界前進,我也因此建立了一個專案「 Lantern 」,希望能讓更多人能以 Isomorphic 架構,快速建構出自己的網站服務,省去許多前期工作的時間。該專案是一個網站服務的樣板,實作了會員系統、權限管理、第三方登入、多國語系和送信機制等功能,在使用者介面上也做了一個還算美觀的介面。基本上,開發者只要 clone 下來,然後修改設定檔或改改介面、增加點功能,就可以快速完成一個屬於自己的全新網站服務。 最特別的是,「 Lantern 」整合了現今所有最新的技術和概念,包括了 Koa、React、FLUX、ES6/7+、Webpack 以及 Semantic UI,大量運用了 Generator、class 及 decorator 等最新 JavaScript 語言特性來簡化設計。所以,如果你想要接觸最新的技術,完全可以透過修改「 Lantern 」專案來學習和熟悉。 目前「 Lantern 」支援 Facebook 剛發佈的最新 React v0.14+ 和 react-router 1.0.0+,也避免使用像 redux 這類反 FLUX 原始設計的框架,讓原本熟悉 React 和 FLUX 架構的開發者,可以快速上手。也提供一些常見的 Extension,方便開發者寫出前後端通用的程式碼,大多數情況下,開發者不需思考程式碼運行在前端還是後端。 快速安裝使用 若想要使用「Lantern」,方式很簡單,先從 Github 取得程式碼: git clone git@github.com:cfsghost/lantern.git 安裝必要之 NPM 模組: npm install 使用 webpack 編譯專案(若要正式上線,可加上 -p 選項來編譯): webpack 運行網站服務: node app.js 最後可以使用瀏覽器開啟網址,確認是否成功: http://...

NAN:Node.js 與 io.js 的 Native Addon 開發利器

自從 Node.js v0.11 版之後,內建的 V8 引擎被更新了,於是 JavaScript 引擎的原生 API 大幅度改變,導致很多以 C/C++ 所撰寫的原生模組紛紛出現相容性問題。影響範圍包括了前陣子發佈的 Node.js v0.12 以及 io.js 1.0+,因為都使用了新版的 V8 JavaScript Engine,而有同樣的問題。 其實這樣的問題已經不是新鮮事,自從 Node.js v0.8 到 v0.10 就開始有些許不相容的問題,只是到了 v0.12 和 io.js 之後,出現了更多狀況。因此 Node.js 圈子內的知名開發者 Rod Vagg  建立了 NAN 專案,用來解決這樣 Native API 不相容的問題。 NAN 全名為 Native Abstractions for Node.js,目標是設計一系列通用 API 供 Native Add-on 開發者所使用,讓開發者可以使用這通用的 API,一次性開發出支援 v0.8、v0.10、v0.12 和 io.js 1.0+ 的原生模組,不必再為 V8 原生 API 相容性所苦。 若想要使用 NAN,可以直接以 NPM 下載: $ npm install nan 然後在 binding.gyp 中加入 include_dirs 的屬性設定,讓 Node.js 或 io.js 引入 NAN 模組: 'include_dirs': [     "<!(node -e \"require('nan')\")" ] 經過這樣的設定配置後,我們就可以在 C/C++ 程式裡面引入 NAN 的標頭檔,開始使用 NAN 的 API: #include <nan.h> NAN_METHOD(Hello) {     NanScope();     NanReturnUndefined();     // 或是這樣寫 NanReturnValue(Undefined()); } 上面的程式碼,代換成舊的版本(v0.8、v0.10),就等同於: Handle<Value> Hello(const Arguments& args) {...

注意!io.js 報到!

圖片
如果你有關注這兩個月 Node.js 的發展,就會發現一些大變動,尤其在最近半路殺出了一個名為 io.js 的 Application Framework,其來勢洶洶朝著 Node.js 而來。於是,很多人看糊塗了,開始搞不清楚兩者的關係,甚至以為他是一個全新的技術。事實上,一切緣由皆由 Node.js 而起,這是起圈內的八卦事件,當然,我們也可以將其看作是社群對把持開放原始碼專案的商業團體,進行的抗議行動。 io.js 的官方網站: https://iojs.org 由於 Node.js 的發展日益興旺,掌握著 Node.js 的發展進度就代表掌握著利益,所以 Joyent 開始掌控著 Node.js 的開發進度。縱使 Node.js 有著開放原始碼社群,也有著許多貢獻者,但新版本的釋出一直受到 Joyent 的掌控,最讓社群不滿的是 v0.10 版之後,已經快兩年沒有發佈新的穩定版本。這意味著,無論社群絞盡腦汁去協助開發 Node.js,成果永遠無法面市,也意味著大家所期待的 ECMAScript 6,遲遲無法在 Node.js 上被支援。 終於,社群等不下去了,在 2014 年底發起新的計劃 io.js ,試圖 fork 原本的 Node.js 專案,目標是如果 Joyent 遲遲不發佈 v0.12 版的 Node.js,就打算自己動手。這個 io.js 的新專案,緊鑼密鼓的展開,吸引了許多開發者的關注及加入,不到兩個月的時間,在 2015 年 1 月中推出了 io.js v1.0.0 的版本,並且打算加緊步調,讓開發與發布週期更為密集。 其實,我們可以將 io.js 的 v1.0 版視為 Node.js v0.12 版,它們本質上是一樣的東西,所以 io.js 也可以支援 NPM,有著一樣的使用方式、API 和架構設計,更相容於 Node.js v0.11 及未來的 v0.12。這代表,原本以 Node.js 所開發的應用程式,理論上都可以正常以 io.js 執行。 至於未來 io.js 是否會將 Node.js 取代呢?我們拭目以待。

Node.js 的精彩應用!整合 bittorrent 與 FUSE 其實不難!

圖片
寫書寫到通訊協定一章,就想起今年來台灣 JSDC 的 Mathias,在台上展示以 Node.js 開發的 Bittorrent 影片下載工具『peerflix』,該工具可以結合 vlc、mplayer 這類的播放器進行 BT 種子的影片播放,相當有趣。此外,他亦展示了使用 VirtualBox 直接開 BT 上的 Ubuntu 安裝ISO 檔的實作。 很多人都說很神、很有趣,但看完後不見得會去了解實作細節。有些人更覺得這是他們無法碰觸的領域,只是當一個神在展示他的神力而已。這樣的情況,讓我感到難過,因為很多這樣的技術細節並不難,除了 bittorrent 本身的演算法本身的實作,或是開發其 Binding 是有困難度之外,其餘的東西根本上都是相當簡單的概念。 我想,這樣並不困難的東西,如果不去解析或了解它,實在是可惜了 JavaScript 至今的發展。 事實上, bittorrent client 的 binding 早有人開發出來並寫成模組。我們只需要使用種子檔案或是 magnet link,就可以透過 binding 去取得檔案資料,甚至是特定段落的資料,就像我們實作 HTTP 續傳那樣簡單,只需指定資料的開始處而已,全都有現成的 API 可使用。 若要播放這些影片內容,只需要建立一個 HTTP Server,再將從 bittorrent 下載完成的影片資料檔,運用 Stream 的技巧導向 HTTP 輸出即可。實作到此,我們就可以透過支援 HTML5 Video 的瀏覽器或是其他支援串流的多媒體播放器,以 HTTP URL 打開影片觀看。 至於 VirtualBox 怎麼去開啟 bittorrent 上的 ISO 檔,然後讀到哪載到哪的技術,其實也不是非常難,運用 Linux/BSD(Mac OS) 上的 FUSE(Filesystem in Userspace)的技術即可達成。雖然這是熟悉系統開發才會知道的技術,但概念與開發上其實並不難,尤其是也有人寫了 Node.js binding,我們可以完全使用 JavaScript 輕易實作。 簡單來說,使用 FUSE,可以讓我們不必觸碰到作業系統核心的驅動程式技術,就可以開發一個自己的檔案系統。然後,我們可以把自己實作的檔案系統掛載到一個本機目錄上。這代表...

Hackathon 活動的『Koa 正在等一個人』簡報釋出!

圖片
很開心,這次十二月的『 Hackathon Taiwan 』相當多人參與,百人的報到數讓所有工作人員都感到興奮。最重要的,多虧了活動夥伴的遊戲設計,這次讓很多隻身而來的人,化解尷尬、相互認識並熱絡起來,最後順利組成隊伍,這算是種格外特別的創舉,過去很少有黑客松能做到這樣的地步。 有趣的是,這次活動找來了重量級的神秘講師 Jeremy Lu (對,就是那位最近紅極一時的 React.js 講者)開課,讓聽眾大飽耳福,絕對不枉來這一趟。有很多人也衝著 Qt 的課程而來,學習 QML 這樣先進的 UI 技術,這次的 QML 遊戲開發課程,相信讓很多人也開心地學會很多技術。 小弟在第二天的結尾,也給了篇一小時的分享『Koa 正在等一個人』,其內容在探討並帶領上手 Koa 這個下一代的網站框架、ECMAScript 6 Generator,以及 Node.js 和 io.js 的最新動態。(事實上是把最近將要出的書,擷取片段內容出來分享) 後記 對於我而言,活動內容再豐富,都比不上找到了好隊友可以一起創作。這次活動,得到了一個硬體工程師加入我們的團隊,所以可以開始進行硬體設計及控制等工作,而且大家相約了下次一起再來。下次,我們將會開始進行各種智慧家電的控制,以及 IoT 的相關應用。看來,我們只差一個設計師的加入了!如果你有興趣,快來加入我們!:-D 下次黑客松活動預計將於 2015 年 1/31、2/1(六、日)兩天,無論你是軟體開發者、硬體開發者、設計師還是學生,都歡迎來參加!而且,一樣會有神秘講師!

OwaViewer 釋出!不用安裝肥滋滋的 Qt 也可以開發 QML!

圖片
在國內,很多人或許對 Qt 很陌生,但這一直是筆者近年來想要推廣的技術,尤其是 QML 這個自 Qt Project 衍生出來的新 UI 技術,更讓人著迷。具有原生效能和擁有炫麗效果的 QML ,確實是一個打造產品的好東西,如大家近來所聽到的 Tesla 汽車、Jolla 手機等,其 UI 就是使用 QML 所開發。當然,之前舊文章中所展示的 UI 和介面,以及能跑在 Android 手機上的 OwaNEXT,也有不少是結合 QML 技術所開發。 推廣過程中總有人質疑,覺得 QML 不是一個設計師能學會的東西。事實上,它的語法相當簡單且模組化,所以也聽聞一些國外的設計公司,其設計師都直接用 QML 做出 UI ,再交給工程師去接上功能。這也是為什麼 HanGee 國民機在開發手機和各種裝置的 UI 時,要選用 QML 為底層的原因了。 因此,筆者自己的公司最近也在籌備許多課程和分享,也與許多朋友成立了一些社群(你可以在 Facebook 加入我們的 Qt @ Taiwan 社群),並設計開發一些相關的工具,以協助更多人能更快速進入到 QML 的世界。不過,因為 UI 與設計師更密切相關,近期應該會針對不懂技術的設計師,推出許多相關的 UI 開發課程。(如果你對這樣的技術有興趣,歡迎與我們聯絡) 其實,這次的黑客松活動與 HanGee 社群合作開設 QML 課程就是一個嘗試,也想收集一些 Qt/QML 初入門者狀況和資料。其中發現一個最大的問題是,無論是技術還非技術人員(如設計師),在安裝 Qt 時就會碰到各種狀況,而且 Qt 開發環境因為功能繁複且龐大,安裝一整套下來要花上不少時間,在學習上也就是一個阻礙。這對技術人員來說,可能不是什麼大問題,但這對設計師來說,就是一個極大的挫折。 因此,我們、講師和 HanGee 社群合作,開發了一個新的工具『OwaViewer』。原本這個工具只是被設計來開發 HanGee 手機介面,但現在可以用來讀取和執行一般的 QML 檔案。這意味著,你再也不需要安裝 Qt 和學習一堆知識,就可以使用 QML 開發使用者介面了,也可以很容易提供一個成果給客戶直接操作,這對許多設計師來說應該是個好消息。 OwaViewer 是個 Open Source Proje...

Hankathon 黑客松專用倒數計時器!

圖片
不用覺得奇怪,Hankathon 沒有拼錯,這是取自 HanGee + Hackathon 的命名。是這次為了 9/20 - 9/21 兩天的 HanGee Hackathon 活動,設計的一個騷包倒數計時器,也是我在邊辦活動邊做的成果之一,用來提醒眾參加者們,時間正在毫不留情的流逝! Source Code:  https://github.com/HanGee/Hankathon 如果你的黑客松、活動需要用到這個倒數計時器,歡迎取用!也歡迎修改成你想要的功能!只是,如果可以的話,麻煩留下蕃薯的小圖,協助讓 HanGee 亮點像吧!:-) 後記 這次的黑客松活動,就在經歷過兩天美好的夜景、日出景色,最後經歷颱風大雨的情境下落幕。雖然中間出了一些烏龍,仍有一些朋友們沒有被好好照顧到,但都在歡樂的氣氛下和滿滿的產出中結束。下我們肯定會再次舉辦,讓更多無論有沒有資身技術背景的朋友,都能夠共同參與並學到東西和經驗回家。:-D 此外,如果有社群或企業想要一同舉行下次的 Hackathon,歡迎連絡我們!

嘴炮不再!MDS 加密檔案系統釋出!

台灣的電玩機臺一直是一個很少人探討的遊戲產業,他們外銷機台到國際各大賭場,除了一直在設計讓人願意掏錢的有趣遊戲機外,也真真實實用到很多資訊科技。在多年前一次南部的經驗,有幸接觸到這樣神秘的產業,也幫他們開發過一些東西。而其中一項專案,就是一個加密檔案系統,讓他們可以保護他們的遊戲程式,避免被對手輕易偷走自家的程式。 於是就有了這個 MDS 檔案系統(Middle Stone Filesystem),採用 blowfish 演算法加密,支援 384-bit key 和同時多組 key 的存取。由於作業系統本身會很容易破解修改,要保留可以將解密工作和 key 放在額外的硬體鎖或晶片上,甚至是多組 key 可跨多個硬體晶片存放,增加破解的難度。所以因此也設計了一些單獨的讀取工具範例,讓硬體鎖的開發人員,可以參考做法,寫在其硬體韌體(Firmware)中。不過,更近一步和硬體整合的版本,礙於敏感,這次就沒有釋出了。 專案網址: https://github.com/cfsghost/mdsfs 其實,這專案多年來一直對周圍的朋友嘴炮說要開放出來,可是一直沒負諸行動(當然也是因為懶惰)。而今天看到 iCloud 被破解的新聞,受到一點資料安全問題的刺激,於是想起這個專案,所以就花點時間挖出來整理一下文件並往 Github 上丟。由於,這個基礎版本很久沒維護了,安全性如何我不能保證,但拿來做學習 FUSE 和加密演算法應用,倒是有點參考價值。如果有人想要接著開發,也非常歡迎! 另外,有些人反應不知道能拿來幹麻。關於這件事,其實把 MDS 當做一個簡單的加密打包工具,也是可以的。 後記 看到 iCloud 被破解的新聞,不由得讓人重新思考雲端和未來物聯網時代,資料安全的重要性。稍為瞭解真象的人通常都會跟你說,千萬不要相信任何人,將東西和隱私放在雲端。而通常你第一個要害怕的是雲端系統管理人員和系統設計人員的操守,他們是不需要經過任何破解手段,即可全權存取你資料的人。再來,我們要擔心的是系統的安全性,設計者和管理者能否真有能力去保護使用這的資料?這從使用者手上的 App、作業系統、瀏覽器,一直到雲端上的一切系統,都是必需要考量的範圍。也因為這樣種種的複雜情境,使用者實在難以得到真正安全的保護。 原因其實很簡單,當檔案自你手邊的機器準...

【Node.js 小密技】使用 crypto 模組亂數產生字串

已非常熟悉 Node.js 的人都知道,crypto 模組是一個無中生有的神器。我們可以用它的 API 加工加密資料,也可以解開加密後的包裹。既然和密碼處理相關,當然也有亂數產生器,可供開發者產生一大堆的亂數資料。 如果你需要一個 32Bytes 長度的亂數資料,可以直接呼叫 crypto.randomBytes() 並帶入長度後生成: var crypto = require('crypto'); var buf = crypto.randomBytes(32); 註:回傳的結果 buf ,是一個 binary buffer,而每一個 Bytes 都會是範圍在 0 ~ 255 (0x00 ~ 0xff)的數字。 不過,在多數應用中,我們更常需要一個亂數字串,而非二進位的亂數資料,這時就需要做一些進一步的加工處理。方法其實不只一種,如建表、取代不可見字元碼等方式都可以,沒有標準做法。但懶惰的開發者們,多半是直接利用 Buffer 內建的 API 來將資料轉換成字串,並指定編碼方式來達成。 下面兩種方法都可行: buf.toString('hex'); buf.toString('base64'); 只是,使用十六進位(hex),會讓你的最後的字串單純只有 0-9 和 a-f 的字元存在,所以使用 base64 是比較好的選擇,讓字串多變並複雜些。 註:base64 編碼是以 6 bits 為單位來進行處理,而 1 Byte 有 8bits。如果你的資料長度非 6 bits 的整數倍長度,base64 會在結尾補上『=』。有些人覺得多了一些『=』符號很醜,就會用 replace() 替代掉或者是一開始就取 6 bits 整數倍長度的亂數資料(如:3 bytes、6 bytes 等等)。 有些情況,我們需要特定長度的亂數字串,也可以搭配使用 substr(),只是要確定生成的字串長度,比我們想要的字串長度還要長。下面的範例,就是取八個字元長度的字串: buf.toString('base64').substr(0, 8); 當然,若你想要一次搞定,也可以將之前所說的,全部串在一起寫: var randomString = crypto.randomBytes(32).toSt...

Express 4 來了!好用的 Router 機制

還記得前陣子,就在書將出版之際,半路殺出來最新的 Express 4,使得筆者手忙腳亂,緊急通知出版社修改書的內容。將所有使用到 Express 的範例,都特別加上版本號的指定,讓讀者在照著範例做時,能夠使用舊的 Express 3.0,而不會發生任何問題。最新的 Express 4 雖然效能提升不少,也有一些好用的新東西,但和舊版有些微 API 的不相容,此外,也因為是新東西,可能很多東西的支援會發生問題,如果舊版本在上線的產品中運行相當穩定,建議先不要急著升級。 Express 4 做了一些改進,有不少新東西,其中相當值得提的一項就是路由機制(Router)的翻新。如果你以前在使用 Node.js + Express 開發網站服務時,因為 Router 很難管理而痛苦不已,這將是一個你會愛上的功能改進。 傳統的使用方法 傳統的 Router 設定方法依然可以運作,我們可以放心使用。 var express = require('express'); // Create express application var app = express(); // Apply this router on (/apis/user) app.get('/', function(req, res) {     // Home }); app.listen(8000); 新 Router 物件的使用方法範例 除了舊的方法之外,你可以用 Router() 去建立一個 Express 的 Router 物件,然後管理你一系列的路由規則。 var express = require('express'); // Create express application var app = express(); // Create a router to handle routes for a set of  user API var userAPI = express.Router(); // Sign in (/apis/user/signin) userAPI.post('/signin', function(req, res) {     // ... }); // Sign out (...

Node.js 的原罪,和 QML 的不合作運動

在上個星期剛結束的 OSDC.tw 2014 活動上給了一個 Talk ,提及用 Node.js 結合 QML 來開發應用程式,讓我們可以使用 Node.js 和 JavaScript 來寫 QML 元件,不需要再使用 C/C++。事實上,這樣的技術看起來簡單,但實際上是困難重重。 其實,要做 Qt 的 Node.js binding,有很多問題要克服,最直接的不外乎是 Event Loop,Node.js 本身是 JavaScript 語言,所以有自己的事件引擎,而 Qt 是一個圖形界面的 Toolkit,一樣也有自己的事件引擎,因此,我們要再解決一次與過去整合 GLib 一樣的問題(詳見舊文: 探究如何整合 GLib Main Event Loop 和 Node.js 的 libuv ),只不過這次要實作的是 Qt 的 QAbstractEventDispatcher。 為了讓 Node.js 可以順利驅動 Qt,筆者之前花了一些時間研究,所以有了一個實驗性質的 Project 『 Brig 』在 Github,也為了 Qt 重新寫了一個新的 libuv 版本的 EventDispatcher。很幸運的,在實作完新的 EventDispatcher 後,已經可以順利的將 Node.js 和 Qt 的 Event Loop 接起來。 但別高興的太早,還有個大問題存在。Qt 5.2 之後將 QML 內的 V4 JavaScript 換成了 Google V8 JavaScript Engine,並且為了一些特性,修改了 V8 的部份實作。很不巧的是,Node.js 的核心也是 V8,這意味著,如果我們使用自己的 Node.js Binding 去建立 QML Engine,程式會馬上崩潰並結束(Segmentation Fault)。 種種問題,你可以說這是 Node.js 的原罪所致,這也是為什麼相當難幫 Qt 寫一個 Node.js 的 Binding,你在 NPM 上也根本找不到良好的 Qt Module 存在。最終我們的做法,還是修改了 Node.js 的部份程式,才能將他們整合在一起。

【OSDC.TW 2014 簡報釋出】當 QML 娶了 Node.js

圖片
去年一年在萬里當兵,基隆對我來說就像旁邊的公園一樣,時常去走走逛逛,然後去廟口吃點東西,最後吹吹帶有奇怪味道的海風,然後依依不捨的回去萬里山中隱居。很遺憾,黃色小鴨在我退伍的第二天,才來到基隆,一直沒機會去看看牠,這也是為什麼我為這次的 Talk 取了一個這麼奇怪的題目。當然,在 OSDC 的活動上,大多數人無法理解這樣奇怪的主題,所以我也在場上直接換了一個時事標題,詳見已釋出的簡報檔: 本次簡報的主題,將提到如何使用 Node.js 開發一個 QML 應用程式,以及如何使用 Node.js 去括充 QML 的功能。QML 能讓開發者很快設計出極酷炫的 UI,但最大的問題是他擁有一個殘廢的 JavaScript 支援,所以任何額外的功能擴充,都必需學會 C/C++ 才能達成,相當的難以開發。 此外,在過去如果 QML 要與 Node.js 做橋接,通常都是以 Node.js 建一個本機的 HTTP Server,然後運用 QML 內建的仿 XHR(使用方式和 API 真的完全模仿),去本機 HTTP Server 要資料。或許這對很多 Web 開發者來說相當容易上手,但有趣的是,他不會有 jQuery,所以你要自己手刻 Ajax 的各種機制,甚至是 Long-polling,痛苦至極。 想一下,我們即便是要與本機溝通,取得或監聽機器上的一些資訊,都要使用 Long-polling,這未免也太小題大做,一點也不簡單和直接。所以這也是為什麼要做 Qtjs,讓我們可以用 Node.js 直接來開發 QML 的元件,直接與 QML 溝通和傳遞資料,而不必再透過 HTTP 的方式。 就以本次簡報的例子來說,我們用 QML 設計了一個 IRC 聊天室的前端,然後運用 Node.js 和第三方模組去連線到 IRC Server,最後把聊天內容收回來畫在 QML 的界面上。並使用 Node.js 設計了一個 QML 元件,使用方式如下: IRC {     onReceived: {         console.log(nickname + ': ' + message);     } } 註:過去開發 QML 元件必需使用 C/C++,...

Node Knockout Taiwan 2013 駭客松活動報名開跑!

Node Knockout Taiwan又要來啦,將於11/9(六) - 11/10(日)舉行!這是一個讓Hacker、程式開發者們熱血沸騰,挑戰48小時不間斷開發的Node.js Hackathon(駭客松)鐵人活動。不用煩腦吃飯、零食、飲料、住宿等生活問題,主辦單位將解決所有的問題,讓你在有限時間內,專心與自己的隊友們從無到有打造自己的作品,並與來自各方的好手們互相交流,贏得比賽。無論你是學生、職業開發者還是從事非程式相關職業的人,都歡迎來共襄盛舉! 立即報名網址: http://nodeknockout.nodejs.tw/ 後記 筆者也將會參加這個活動,但還沒找到隊友,也還沒想好題目,有興趣的人可以來湊團。:-P 對了!別偷跑!逼自己48小時內完成作品,才能挑戰自己的極限!超越自己!

jsdx-disk 讓你使用 JavaScript 管理儲存裝置

『 Stem OS 』是一個 JavaScript 作業系統,內建 Node.js 和許多 JavaScript 的系統 APIs。如果你有在筆者的開發動態,就會發現 Stem OS 是我們 Mandice 團隊目前的開發重點和產品,我們一直期望能讓懂 JavaScript 的人,都可以來開發系統程式、嵌入式系統,此外,也想運用 JavaScript 語言的流行度,讓嵌入式系統開發門檻降低,使其更為簡單、快速。如果你家中有看似沒用的舊電腦,在安裝 Stem OS 之後,便可以立即用 JavaScript 自行寫一些應用程式,賦予這舊電腦全新的用途。還記得,在今年的 OSDC 活動上,小弟上台給了一場 lightening Talk,即是探討如何將舊電腦改造成一個無紙化傳真機,而改造的時間只需要 5 分鐘,包括安裝 Stem OS 和寫幾行 JavaScript 程式。有興趣的人可以參閱當時的投影片『 JSDC 2013 簡報釋出!NPK 與 JavaScript OS (Stem) 登場! 』。 JavaScript 語言的好處就是用它寫的程式無需編譯,效能也不俗,這意味著,當你在開發 PC 平台之外的嵌入式裝置(如:ARM),你不必再忍受跨平台編譯(cross-compile)的痛苦,可以很快速開發你的應用。此外 Stem OS 已經將系統和硬體的支援都已經為你處理好,也提供許多低階的系統 APIs,且一開機就是跑你的專屬程式,你可以專心的打造自己的嵌入式應用,完全不用再煩腦和花大量時間在系統整合和移植的開發上。 既然 Stem OS 已經將許多系統功能包裝成 APIs,讓 JavaScript 可以透過這些介面從 UI 控制到硬體,代表我們實際上做了很多這方面的準備工作,本文將要提到的 jsdx-disk,便是其中之一。 jsdx-disk 顧名思義是一個控制硬碟的系統 APIs,你可以用他掛載(Mount)、切割磁區(Partition)和格式化(Format)硬碟。更進一步,你可以用他監控系統上的儲存裝置,以及取得這些儲存裝置的硬體資訊,更進一步處理熱插拔(Hotplug)的行為。在 Stem OS 中,我們以 JavaScript 寫了一支常註程式(Daemon),監控熱插拔隨身碟,自動掛載(Automount)的機制,而這功能就是運用了 js...

COSCUP 2013 is coming!

今年 COSCUP 很有錢、很盛大,整個活動從中研院移師到了台北國際會議廳,議程多達八軌。很難想像三四年前,自己幫忙 COSCUP 辦活動時的情景,和今天相較之下,當年的活動實在迷你,大家都希望哪一天能殺入台北國際會議廳。沒想到,COSCUP 靠後起之秀多年來的努力,真的在今年達成所有人的願望!我們真的要為這些工作人員和總召柏強喝采!謝謝他們每年不辭辛勞的貢獻! 慚愧的是,COSCUP 長越大,更顯得我小小的講者的微不足道,如今我唯一能貢獻的,大概就只剩對 Open Source 的熱情。因此,自去年在 COSCUP 2012 的國際舞台『發表退學宣言』後,這個大學讀了七年還是沒畢業的我,今年仍厚著臉皮投了稿,稿也被入取。這邊非常感謝議程審核人員的親睞,讓我贏得今年的一段宣言時間,還有開賣一分鐘內就沒有的入場門票。 :-) 至於我這次要講的主題是:『我用 Node.js 開發自己的 Web 瀏覽器?』 時間地點是:COSCUP 2013 第二天(8/4) 10:00,101CD 場。 其實,正當投稿截止之際,當時熱映的『鋼鐵人3』給我了很大的啟示。不禁思考,身為工程師的我們,是否已經被工具和自己曾經所創造的東西所束縛了?如果我們今天把眼前的電腦給砸了,是否全身上下功力全失?無法有任何作為? 這樣的概念,套在 JavaScript 這個近年來很夯的語言上,更是貼切不過。對很多人而言,失去瀏覽器為依靠的 JavaScript,令人感到不安、充滿焦慮,好像就不知道能用 JavaScript 做什麼事了。所以,為了破除迷思,就面對他吧!這是一個小小的實驗,讓我們嘗試用 JavaScript(Node.js) 打造自己的網頁瀏覽器,支援 HTML5/CSS3/WebGL 等最新標準的瀏覽器! 如果你至今還是無法完全明白 Node.js 的能耐,期待與你見面交流。

【玩轉 Cubieboard】安裝 u-boot 到 SD Card

當你得到 Cubieboard 後,首先要做的就是學習如何啟動你的作業系統。Cubieboard 可以支援 SD Card 啟動,這通常也是最容易入門的 Embedded System 開機方法。你只要準備一張 Micro SD Card,切割出分割區,然後把 Bootloader 和作業系統放進去即可。 安裝 u-boot Cubieboard 使用的是 u-boot 做為 bootloader,你必須先下載 Source Code 然後 Compile: git clone https://github.com/linux-sunxi/u-boot-sunxi.git make Cubieboard CROSS_COMPILE=arm-linux-gnueabihf- 如果你的系統 toolchain 都已經安裝完成,且都沒有問題,u-boot 會順利編譯通過,然後你會在 u-boot 的目錄裡得到兩個檔案: spl/sunxi-spl.bin u-boot.bin 有了這兩個檔案,安裝 u-boot 就不是什麼問題,只需要使用 dd 指令來把 bootloader 寫入 SD Card: dd if=spl/sunxi-spl.bin of=/dev/sdb bs=1024 seek=8 dd if=u-boot.bin of=/dev/sdb bs=1024 seek=32 註:/dev/sdb 是 SD Card 的裝置路徑,請依照你系統上的實際狀況,填入正確路徑。 後記 有趣的是,很久沒有玩開發板了,自從兩年多前開始陸續投入各廠商的專案後,所碰到的 ARM Board,清一色都是客製化的產品樣板。而幫大廠商做產品,和自己玩開發板相當不一樣,同樣是驅動程式有問題,要做的是打電話罵人;如果會當機,快打電話罵人;如果缺任何東西,打電話罵人就對了!所以,在客戶的專案中,做最多的總是證明硬體廠商的問題,讓硬體廠商們心甘情願幫你把問題排除。雖然還是要熟悉 Debug 的技巧,但多半不用自己煩惱『該怎麼辦』,只需要下指導棋。因此,自己也慢慢養成很多惰性,除非是真的沒人可以幫你,才肯親自出手跳下去從底層到應用程式,深入修正問題。 但是,玩開發板可不是這麼一回事。有問題?你自己搞定吧。搞不定?問 Google 大神吧。還是不行?慢慢看...

JSDC 2013 簡報釋出!NPK 與 JavaScript OS (Stem) 登場!

最近比較忙,一直拖到現在,才有點時間上傳我在今年 JSDC 的簡報。這次,給的講題是『我編譯故我在:誰說 Node.js 程式不能編成 Binary』,主要探討怎麼使用 NPK 打包你寫的 Node.js 程式,以及把 JavaScript 程式碼編譯成二進位(Binary)檔,甚至是進一步的加密設計。NPK 雖然還只是初版,目前支援了三種博君一笑的封裝等級:卸妝(Remove mock-up)、媽媽不認識(Mom doesn't recognize)、爸爸不認識(Dad doesn't recognize),有興趣了解這三種等級不同的人,可以參考我的簡報: 當然,參加這種活動需要的是熱血,不在 Lightening Talk 閃電秀登場一下怎麼可以呢?於是當天毫不考慮的搶了一個名額,用短短的五分鐘介紹 Mandice 團隊最近在做的 JavaScript OS - 『 Stem 』。在 Stem 的平台之下,無論你是否為嵌入式系統或作業系統的高手,只需要懂 JavaScript 和純粹的 Web 相關技術,你就可以開發自己的嵌入式應用,或讓你的舊電腦或開發板有全新的用途。 後記 大家都知道,做外包工作,一向很難累積東西,唯一能累積的,就是設計工具以加速自己做案子的速度。因此,Stem OS 就是我們經歷過許多的案子後,自己設計的平台,讓我們可以盡可能完全用 JavaScript 快速開發嵌入式系統,然後結合硬體開發設計各式應用。在 Stem 裡,只需要懂 JavaScript 和 Web 相關技術,就能勝任開發工作,實現你心中的 Idea。如果說 3D Printer 是可以讓你快速打造模型實體,那 Stem OS,就是能將你心中的 Idea,化為空硬體的靈魂,Idea 的 3D Printer。 這對創業者、創新者和非資訊產業的公司來說,都是一個可以快速切入設計產品和自家工具的機會,不妨嘗試看看。:-) 如果有任何需求,無論是顧問、教育訓練還是合作開發,都歡迎與我們 Mandice 聯絡,或來信到 fred@mandice.com。

OSDC.TW 2013 簡報釋出!使用 JavaScript 大搞桌面應用和嵌入式系統!

OSDC.TW 2013 順利在中央研究院國際會議廳閉幕,但一如往年,失落感接踵而來。為了這次的 Talk,可說是花了不少工夫,除了研究 Webkit 的內部實作,以及 V8 JavaScript Engine 之外,最後也發表了一個新的 JavaScript 作業系統『 Stem 』,一個可以完全用 JavaScript 和 Web 技術去開發應用程式的嵌入式作業系統。Stem 落實了用 JavaScript 語言開發嵌入式系統的理想,並簡化嵌入式應用開發,讓人人都能輕鬆躍過以往嵌入式系統開發的艱澀門檻。 這邊釋出當天的簡報檔,有興趣者可自行參閱: 此外,對 Stem 有興趣的人,可以拜訪專案網站: http://stem.mandice.org/ 也可以在 IRC 上交流: 英文頻道:irc.freenode.net #stemos 中文頻道:irc.freenode.net #stemos-zh 註:目前 Stem 已釋出 x86 版本的安裝鏡像檔,近期內將會釋出 ARM 的版本,敬請期待。有興趣參與開發者,歡迎來信一同交流。