輕量級桌面應用開發的捷徑——nw.js

博客地址

每一個程序員都但願用本身喜歡的語言，本身喜歡的平臺、工具，寫本身喜歡的程序。因而咱們會看到有人在Win下用Visual Studio愉快地coding，也會看到有人在OS X下用Xcode來開發，或者是用Sublime Text不受平臺限制地玩。

固然了，願望每每是美好的，然而事與願違的狀況時有發生。若是你基本都是用OS X，卻有人讓你寫一個帶有簡單界面的小程序，保證在他的Win系統上必定能夠運行，那麼你是否是有點抓狂。

選擇哪條路？

固然，我能夠在Visual Studio（已經有Mac OS X版）下用MFC或者其餘框架來寫，可是總感受有點重量級，而且不能移植到其餘平臺（萬一哪天讓我寫個OS X下的界面呢，想一想都毛骨悚然啊！）

因此我想找的就是一個能夠跨平臺的、輕量級的圖形界面開發的庫，因而想到了喜歡的Python，而後發現它下面的GUI開發框架還真很多：wxPython, tkInter, PyGtk, PyQt。

• wxPython: 首先官網至關簡潔（醜陋），而後快速瀏覽了一下文檔，發現有這塊：Cross-Platform Development Tips，告訴你跨平臺要注意哪些東東，看來不是我心中想的那樣只須要寫一份代碼，在不一樣平臺編譯一下就能夠，因而放棄。

• TkInter: 也在其餘地方看到有人推薦這個，可是感受文檔特別亂，網上一些教程也至關簡陋，裏面界面醜的掉渣，也放棄了。

後面兩個我甚至都沒耐心繼續看下去了，由於我不經意看到了nw.js，他就像一座燈塔，冥冥之中照亮了前進的方向啊。

nwjs——前進的方向！

Github上nw.js有兩萬多Star和接近3000的Fork，說明它已經至關成熟，不會是某我的隨興放的一個並不成熟的技術。而且在Github項目的最後面，顯示Intel有贊助這個項目，看起來很牛的樣子。並且關於nw.js的資料也特別齊全，首先來看看它的特色：

• 支持用HTML5, CSS3, JS和WebGL來寫應用程序，包括桌面端和移動端；

• 徹底支持Node.js APIs和全部的第三方模塊；

• 性能也不會不好，對於輕量級的應用足夠了；

• 對應用進行打包和發佈十分簡單，也就是說寫一份代碼很容易移植到不一樣的平臺（包括主流的Linux, Mac OS X 和 Windows）；

而後做者怕你認爲它很難打交道，進而「知難而退」，就在項目主頁裏用許多slides來介紹它。

• Introduction to node-webkit (slides)

• WebApp to DesktopApp with node-webkit (slides)

下面這張slide解決了「nw.js能作什麼？」的問題，簡單來講nw.js就是使HTML, CSS, JavaScript寫的本來在瀏覽器上運行的程序，也能夠在桌面端運行。

下面這張slide解決了「怎麼用nw.js完成任務？」的問題，

最後，開發者怕你懷疑nw.js的強大，又提供了幾個Demo和許多成功的案例來打消咱們的顧慮。

nwjs——拿下助攻！

決定用nw.js以後，就開始補充相應的知識啦。首先本身沒有怎麼去學過JavaScript, HTML, CSS這類web方面的語言，不過想來也不會比C++難。學習的成本也應該比學習MFC, wxPython低不少，而且這些語言太基礎、使用場景太多了，因此遲早都得了解一下，乾脆借這個機會一邊學一邊作具體的東西。因而買了《JavaScript DOM編程藝術(第2版)》這本書拿來入門。

講了這麼多，還沒說我具體要作什麼呢，其實要作的事情特別簡單，就是統計一本書的頁碼中一共有多少個0，1，2，3，4，5，6，7，8，9。關於這個問題，詳細看前面的那篇博客：講得明白，但寫的明白嗎？。

我要實現的目標很簡單，在輸入正確的數字時，給出統計結果；輸入錯誤的數字時，則給出錯誤提示，重置輸入框和統計結果。以下：

實現過程至關簡單，特別是對於那些作過web開發的，詳細過程就不在這裏給出了，只提供一個簡單的程序邏輯圖吧。

源碼十分簡單，能夠在這裏找到，結構以下：

tree
.
├── index.html
├── main.js
├── package.json
└── style.css

0 directories, 4 files

打包到各個平臺也有詳細的文檔。以Win爲例，只須要三步便可：

1. 將全部工程文件，放在一個文件夾下，確保package.json在根目錄，而後壓縮爲.zip格式，並將壓縮文件的後綴由.zip改成.nw；

2. 在nw.js的環境目錄下執行copy /b nw.exe+you_nw_name.nw you_app_name.exe （這一步以後，就能夠在生成的目錄中直接運行you_app_name.exe，它依賴同目錄下的一些其餘庫）；

3. 用Enigma Virtual Box將you_app_name.exe和依賴的庫打包到單個exe文件中，這樣咱們的應用在沒有任何編程環境的win機器上均可以運行。

nwjs——你值得擁有！

不得不提nw.js開發出的應用已經涵蓋了許多領域：

1. WhatsApp 經典的聊天應用，還有Messenger；

2. Powder Player 種子下載，以及視頻播放器；

3. Boson Editor 代碼編輯器，甚至還有一款Markdown編輯器叫Story-writer；

4. Leanote Desktop App 相似Evernote的筆記類應用程序；

5. Mongo Management Studio 數據庫管理應用。

來欣賞一下一些應用的截圖吧，不得不說nw.js開發出的應用一點不比原生的醜陋啊。

Mongo Management Studio

Soundnode App

看來nw.js贏得了不少青睞，那麼還有什麼能阻止咱們擁抱nw.js呢？。

---

ps：

• 若是有的連接打不開，先檢查打開的姿式對不對。

• 更多文章見 個人主頁