SlideShare a Scribd company logo
Node.js
    進攻桌面開發
用 HTML5 開發跨平台的單機版應用程式!
Fred Chien
   錢逢祥
Fred Chien
   錢逢祥
fred-zone.blogspot.com
cfsghost At gmail.com
Mandice
有多少人知道
How many people know
JavaScript 辛酸血淚史
  JavaScript 開發年資大調查
沿街叫罵喊打
奇怪的運作原理
醜不拉嘰
語法設計差
動作緩慢
效能不彰
開發者都不開發者了
會 Copy & Paste 就可以自稱會寫




    還記得首頁製作百寶箱這個可怕的箱子嗎?
殊不知
Nobody knows
鐘樓怪人也有可人的一面
    Lovely
史瑞克 仍可把到正妹
Node.js
V8 + APIs
百年修得同船渡
你這樣就滿足了嗎?
   Enough !?
當泡麵師父都可以來賣電腦
    泡麵科技產業
我們怎麼可以止步不前?
最少也應該吃泡麵洩恨
然後努力搞點新花樣
JavaScript
已經征服三大洲
前端、後端、雲端
What's Next?
JavaScript
 桌面應用程式
Think About It
性感的存在
 瀏覽器
HTML5
 CSS
WebGL
HTML5
 CSS
WebGL
HTML5
 CSS
WebGL
My Application




                 HTML5
                  CSS
                 WebGL
喔。不過就是沒邊框。
window.open('page.html', *=no);
把瀏覽器扒光而已嘛
   誰都會
看到全裸的美女無動於衷?
My Application




                 HTML5
                  CSS
                 WebGL
My Application




         Node.js Inside
node-webkit
node-webkit at github
這意味著我不想要.....
HTTP Server
  Node.js
HTTP Server
                     Node.js
GET/POST/..
.
              RESTful APIs
              Ajax
              ....etc
HTTP Server
                     Node.js
GET/POST/..
.
              RESTful APIs
              Ajax
              ....etc
我希望這樣寫一支程式 killsecret.html

<html>
<head>
<title>Hey</title>
<script>
   var fs = require('fs');
   fs.unlinkSync('/home/fred/聊天記錄');
</script>
</head>
</html>
node-webkit
       +
killsecret.html
立即殺光我的小秘密
 沒有用到 HTTP 方法
node-webkit
瀏覽器本身內建 Node.js
追隨著 Chromium 的腳步
  絕對比 IE 支援更多 Web 標準
追隨著 Chromium 的腳步
  HTML5/CSS3/WebGL... etc
追隨著 Chromium 的腳步
 還可以跨平台 Windows/Linux/Mac
用 Node.js 熬七七四十九天
    數以萬計的第三方模組
用 Node.js 熬七七四十九天
    經過後端考驗的穩定度
其他更多功能
將 JS 程式 Compile 成 Binary 檔
其他更多功能
將 JS 程式打包進執行檔內
如何打造桌面應用程式
    Usage
Your Application



          index.html
          js/
          img/
          css/
Your Application
                   package.json

          index.html
          js/
          img/
          css/
package.json

{
    "name": "hello world",
    "main": "index.html"
}
執行
Run
nw [App Path]
 ./nw /home/fred/myapp
你也可以打包成 ZIP 檔
    myapp.nw
執行包成 ZIP 檔的程式
nw [zip file]
./nw /home/fred/myapp.nw
做成獨立執行檔
myapp.exe (standalone)
copy /b nw.exe+app.nw myapp.
             exe
          Windows
$ cat /usr/bin/nw app.nw >
myapp
$ chmod +x myapp
              Linux
node-webkit
node-webkit


myapp.nw
node-webkit


myapp.nw
Live Demo
更多實例
Markdown Editor
Tool for Web Developer
Reddit Client
附帶一提
Node.js
可以開發桌面應用
舊電腦
Raspberry Pi
 ARM Board
    ...
跑 Node.js 應用?
甚至使用 node-webit 跑 GUI 程式?
純 JavaScript
開發嵌入式系統?
不是每個人都搞 Porting
 買了很多 ARM 板丟一邊的舉手?
Stem
Stem
讓你無痛跑 Node.js 應用的嵌入式 OS
Stem
Support x86 and ARM
Stem
千萬別用中文單唸這個名字,感謝。
Stem
當然也別用 Google Translate
Download
stem.mandice.org
硬體這麼便宜
懂 Node.js + Web 就可以 DIY 嵌入式應用
HW + Stem OS + Your App
懂 Node.js + Web 就可以 DIY 嵌入式應用
Enjoy It
Question ?
Thanks !

More Related Content

What's hot

CI, CD with Docker, Jenkins and Tutum
CI, CD with Docker, Jenkins and TutumCI, CD with Docker, Jenkins and Tutum
CI, CD with Docker, Jenkins and Tutum
Sreenivas Makam
 
Thick client pentesting_the-hackers_meetup_version1.0pptx
Thick client pentesting_the-hackers_meetup_version1.0pptxThick client pentesting_the-hackers_meetup_version1.0pptx
Thick client pentesting_the-hackers_meetup_version1.0pptx
Anurag Srivastava
 
Kubernetes 101 and Fun
Kubernetes 101 and FunKubernetes 101 and Fun
Kubernetes 101 and Fun
Mario-Leander Reimer
 
今話題のいろいろなコンテナランタイムを比較してみた
今話題のいろいろなコンテナランタイムを比較してみた今話題のいろいろなコンテナランタイムを比較してみた
今話題のいろいろなコンテナランタイムを比較してみた
Kohei Tokunaga
 
Drone CI/CD Platform
Drone CI/CD PlatformDrone CI/CD Platform
Drone CI/CD Platform
Bo-Yi Wu
 
Kubernetes security
Kubernetes securityKubernetes security
Kubernetes security
Thomas Fricke
 
Containerd + buildkit breakout
Containerd + buildkit breakoutContainerd + buildkit breakout
Containerd + buildkit breakout
Docker, Inc.
 
Start your adventure with docker
Start your adventure with dockerStart your adventure with docker
Start your adventure with docker
Sagar Dash
 
Weaveを試してみた
Weaveを試してみたWeaveを試してみた
Weaveを試してみた
Kazuto Kusama
 
Docker Networking Overview
Docker Networking OverviewDocker Networking Overview
Docker Networking Overview
Sreenivas Makam
 
Top 5 benefits of docker
Top 5 benefits of dockerTop 5 benefits of docker
Top 5 benefits of docker
John Zaccone
 
Windows Server 2019 で Container を使ってみる
Windows Server 2019 で Container を使ってみるWindows Server 2019 で Container を使ってみる
Windows Server 2019 で Container を使ってみる
Kazuki Takai
 
Gitlab ci e kubernetes, build test and deploy your projects like a pro
Gitlab ci e kubernetes, build test and deploy your projects like a proGitlab ci e kubernetes, build test and deploy your projects like a pro
Gitlab ci e kubernetes, build test and deploy your projects like a pro
sparkfabrik
 
SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路
SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路
SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路
Rick Hwang
 
Thick Application Penetration Testing: Crash Course
Thick Application Penetration Testing: Crash CourseThick Application Penetration Testing: Crash Course
Thick Application Penetration Testing: Crash Course
Scott Sutherland
 
[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3
[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3
[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3
Ji-Woong Choi
 
도커 없이 컨테이너 만들기 3편
도커 없이 컨테이너 만들기 3편도커 없이 컨테이너 만들기 3편
도커 없이 컨테이너 만들기 3편
Sam Kim
 
BuildKitによる高速でセキュアなイメージビルド (LT)
BuildKitによる高速でセキュアなイメージビルド (LT)BuildKitによる高速でセキュアなイメージビルド (LT)
BuildKitによる高速でセキュアなイメージビルド (LT)
Akihiro Suda
 
Kubernetes Introduction
Kubernetes IntroductionKubernetes Introduction
Kubernetes Introduction
Martin Danielsson
 
iOS Application Security
iOS Application SecurityiOS Application Security
iOS Application Security
Egor Tolstoy
 

What's hot (20)

CI, CD with Docker, Jenkins and Tutum
CI, CD with Docker, Jenkins and TutumCI, CD with Docker, Jenkins and Tutum
CI, CD with Docker, Jenkins and Tutum
 
Thick client pentesting_the-hackers_meetup_version1.0pptx
Thick client pentesting_the-hackers_meetup_version1.0pptxThick client pentesting_the-hackers_meetup_version1.0pptx
Thick client pentesting_the-hackers_meetup_version1.0pptx
 
Kubernetes 101 and Fun
Kubernetes 101 and FunKubernetes 101 and Fun
Kubernetes 101 and Fun
 
今話題のいろいろなコンテナランタイムを比較してみた
今話題のいろいろなコンテナランタイムを比較してみた今話題のいろいろなコンテナランタイムを比較してみた
今話題のいろいろなコンテナランタイムを比較してみた
 
Drone CI/CD Platform
Drone CI/CD PlatformDrone CI/CD Platform
Drone CI/CD Platform
 
Kubernetes security
Kubernetes securityKubernetes security
Kubernetes security
 
Containerd + buildkit breakout
Containerd + buildkit breakoutContainerd + buildkit breakout
Containerd + buildkit breakout
 
Start your adventure with docker
Start your adventure with dockerStart your adventure with docker
Start your adventure with docker
 
Weaveを試してみた
Weaveを試してみたWeaveを試してみた
Weaveを試してみた
 
Docker Networking Overview
Docker Networking OverviewDocker Networking Overview
Docker Networking Overview
 
Top 5 benefits of docker
Top 5 benefits of dockerTop 5 benefits of docker
Top 5 benefits of docker
 
Windows Server 2019 で Container を使ってみる
Windows Server 2019 で Container を使ってみるWindows Server 2019 で Container を使ってみる
Windows Server 2019 で Container を使ってみる
 
Gitlab ci e kubernetes, build test and deploy your projects like a pro
Gitlab ci e kubernetes, build test and deploy your projects like a proGitlab ci e kubernetes, build test and deploy your projects like a pro
Gitlab ci e kubernetes, build test and deploy your projects like a pro
 
SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路
SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路
SRE Conf 2022 - 91APP 在 AWS 上的 SRE 實踐之路
 
Thick Application Penetration Testing: Crash Course
Thick Application Penetration Testing: Crash CourseThick Application Penetration Testing: Crash Course
Thick Application Penetration Testing: Crash Course
 
[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3
[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3
[오픈소스컨설팅]Docker기초 실습 교육 20181113_v3
 
도커 없이 컨테이너 만들기 3편
도커 없이 컨테이너 만들기 3편도커 없이 컨테이너 만들기 3편
도커 없이 컨테이너 만들기 3편
 
BuildKitによる高速でセキュアなイメージビルド (LT)
BuildKitによる高速でセキュアなイメージビルド (LT)BuildKitによる高速でセキュアなイメージビルド (LT)
BuildKitによる高速でセキュアなイメージビルド (LT)
 
Kubernetes Introduction
Kubernetes IntroductionKubernetes Introduction
Kubernetes Introduction
 
iOS Application Security
iOS Application SecurityiOS Application Security
iOS Application Security
 

Similar to Node.js 進攻桌面開發

这年头,你只需要懂Node webkit
这年头,你只需要懂Node webkit这年头,你只需要懂Node webkit
这年头,你只需要懂Node webkitLainZQ
 
Non-MVC Web Framework
Non-MVC Web FrameworkNon-MVC Web Framework
Non-MVC Web Framework
Fred Chien
 
2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swttka
 
建立前端开发团队 (Front-end Development Environment)
建立前端开发团队 (Front-end Development Environment)建立前端开发团队 (Front-end Development Environment)
建立前端开发团队 (Front-end Development Environment)
Joseph Chiang
 
NodeJS基礎教學&簡介
NodeJS基礎教學&簡介NodeJS基礎教學&簡介
NodeJS基礎教學&簡介
GO LL
 
Node js feat pegasus
Node js feat pegasusNode js feat pegasus
Node js feat pegasus
cnfi
 
使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統Hsu Ping Feng
 
Node.js长连接开发实践
Node.js长连接开发实践Node.js长连接开发实践
Node.js长连接开发实践
longhao
 
網頁開發工具 20140630
網頁開發工具 20140630網頁開發工具 20140630
網頁開發工具 20140630Yeh Yung-Hsin
 
Responsive Web UI Design
Responsive Web UI DesignResponsive Web UI Design
Responsive Web UI Design
jay li
 
Node分享 展烨
Node分享 展烨Node分享 展烨
Node分享 展烨
tb-vertical-guide
 
從頭打造 C#、.NET 與 ASP.NET Core 開發環境
從頭打造 C#、.NET 與 ASP.NET Core 開發環境從頭打造 C#、.NET 與 ASP.NET Core 開發環境
從頭打造 C#、.NET 與 ASP.NET Core 開發環境
Will Huang
 
IDF2013大会分享——《使用新浪移动云开发全平台应用》
IDF2013大会分享——《使用新浪移动云开发全平台应用》IDF2013大会分享——《使用新浪移动云开发全平台应用》
IDF2013大会分享——《使用新浪移动云开发全平台应用》easychen
 
用最潮的 Java script 盡情開發 kde qt 程式
用最潮的 Java script 盡情開發 kde qt 程式用最潮的 Java script 盡情開發 kde qt 程式
用最潮的 Java script 盡情開發 kde qt 程式
Fred Chien
 
Study4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionicStudy4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionic
Kyle Shen
 
Html5
Html5Html5
Html5
cazhfe
 
常用开发工具介绍
常用开发工具介绍常用开发工具介绍
常用开发工具介绍
haozes
 
App house
App houseApp house
App house
Fred Chien
 
Node js实践
Node js实践Node js实践
Node js实践myzykj
 

Similar to Node.js 進攻桌面開發 (20)

这年头,你只需要懂Node webkit
这年头,你只需要懂Node webkit这年头,你只需要懂Node webkit
这年头,你只需要懂Node webkit
 
Non-MVC Web Framework
Non-MVC Web FrameworkNon-MVC Web Framework
Non-MVC Web Framework
 
2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt
 
建立前端开发团队 (Front-end Development Environment)
建立前端开发团队 (Front-end Development Environment)建立前端开发团队 (Front-end Development Environment)
建立前端开发团队 (Front-end Development Environment)
 
NodeJS基礎教學&簡介
NodeJS基礎教學&簡介NodeJS基礎教學&簡介
NodeJS基礎教學&簡介
 
Node js feat pegasus
Node js feat pegasusNode js feat pegasus
Node js feat pegasus
 
使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統
 
Node.js长连接开发实践
Node.js长连接开发实践Node.js长连接开发实践
Node.js长连接开发实践
 
網頁開發工具 20140630
網頁開發工具 20140630網頁開發工具 20140630
網頁開發工具 20140630
 
All about NodeJS
All about NodeJSAll about NodeJS
All about NodeJS
 
Responsive Web UI Design
Responsive Web UI DesignResponsive Web UI Design
Responsive Web UI Design
 
Node分享 展烨
Node分享 展烨Node分享 展烨
Node分享 展烨
 
從頭打造 C#、.NET 與 ASP.NET Core 開發環境
從頭打造 C#、.NET 與 ASP.NET Core 開發環境從頭打造 C#、.NET 與 ASP.NET Core 開發環境
從頭打造 C#、.NET 與 ASP.NET Core 開發環境
 
IDF2013大会分享——《使用新浪移动云开发全平台应用》
IDF2013大会分享——《使用新浪移动云开发全平台应用》IDF2013大会分享——《使用新浪移动云开发全平台应用》
IDF2013大会分享——《使用新浪移动云开发全平台应用》
 
用最潮的 Java script 盡情開發 kde qt 程式
用最潮的 Java script 盡情開發 kde qt 程式用最潮的 Java script 盡情開發 kde qt 程式
用最潮的 Java script 盡情開發 kde qt 程式
 
Study4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionicStudy4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionic
 
Html5
Html5Html5
Html5
 
常用开发工具介绍
常用开发工具介绍常用开发工具介绍
常用开发工具介绍
 
App house
App houseApp house
App house
 
Node js实践
Node js实践Node js实践
Node js实践
 

More from Fred Chien

MakerBoard: MT7688 Emulator
MakerBoard: MT7688 EmulatorMakerBoard: MT7688 Emulator
MakerBoard: MT7688 Emulator
Fred Chien
 
Brig:Node.js + QML 華麗大冒險
Brig:Node.js + QML 華麗大冒險Brig:Node.js + QML 華麗大冒險
Brig:Node.js + QML 華麗大冒險
Fred Chien
 
超酷炫科幻 UI:QML 入門
超酷炫科幻 UI:QML 入門超酷炫科幻 UI:QML 入門
超酷炫科幻 UI:QML 入門
Fred Chien
 
Koa 正在等一個人
Koa 正在等一個人Koa 正在等一個人
Koa 正在等一個人
Fred Chien
 
OwaNEXT
OwaNEXTOwaNEXT
OwaNEXT
Fred Chien
 
QML + Node.js
QML + Node.jsQML + Node.js
QML + Node.js
Fred Chien
 
Stem OS Proposal
Stem OS ProposalStem OS Proposal
Stem OS Proposal
Fred Chien
 
Stem is JavaScript OS
Stem is JavaScript OSStem is JavaScript OS
Stem is JavaScript OS
Fred Chien
 
我編譯故我在:誰說 Node.js 程式不能編成 binary
我編譯故我在:誰說 Node.js 程式不能編成 binary我編譯故我在:誰說 Node.js 程式不能編成 binary
我編譯故我在:誰說 Node.js 程式不能編成 binaryFred Chien
 
Java script 全面逆襲!使用 node.js 打造桌面環境!
Java script 全面逆襲!使用 node.js 打造桌面環境!Java script 全面逆襲!使用 node.js 打造桌面環境!
Java script 全面逆襲!使用 node.js 打造桌面環境!
Fred Chien
 
Enjoy Writing Modern Desktop Application in JavaScript
Enjoy Writing Modern Desktop Application in JavaScriptEnjoy Writing Modern Desktop Application in JavaScript
Enjoy Writing Modern Desktop Application in JavaScript
Fred Chien
 
軟體人甘苦談
軟體人甘苦談軟體人甘苦談
軟體人甘苦談
Fred Chien
 
Let s Enjoy Node.js
Let s Enjoy Node.jsLet s Enjoy Node.js
Let s Enjoy Node.js
Fred Chien
 
How to Write Node.js Module
How to Write Node.js ModuleHow to Write Node.js Module
How to Write Node.js Module
Fred Chien
 

More from Fred Chien (14)

MakerBoard: MT7688 Emulator
MakerBoard: MT7688 EmulatorMakerBoard: MT7688 Emulator
MakerBoard: MT7688 Emulator
 
Brig:Node.js + QML 華麗大冒險
Brig:Node.js + QML 華麗大冒險Brig:Node.js + QML 華麗大冒險
Brig:Node.js + QML 華麗大冒險
 
超酷炫科幻 UI:QML 入門
超酷炫科幻 UI:QML 入門超酷炫科幻 UI:QML 入門
超酷炫科幻 UI:QML 入門
 
Koa 正在等一個人
Koa 正在等一個人Koa 正在等一個人
Koa 正在等一個人
 
OwaNEXT
OwaNEXTOwaNEXT
OwaNEXT
 
QML + Node.js
QML + Node.jsQML + Node.js
QML + Node.js
 
Stem OS Proposal
Stem OS ProposalStem OS Proposal
Stem OS Proposal
 
Stem is JavaScript OS
Stem is JavaScript OSStem is JavaScript OS
Stem is JavaScript OS
 
我編譯故我在:誰說 Node.js 程式不能編成 binary
我編譯故我在:誰說 Node.js 程式不能編成 binary我編譯故我在:誰說 Node.js 程式不能編成 binary
我編譯故我在:誰說 Node.js 程式不能編成 binary
 
Java script 全面逆襲!使用 node.js 打造桌面環境!
Java script 全面逆襲!使用 node.js 打造桌面環境!Java script 全面逆襲!使用 node.js 打造桌面環境!
Java script 全面逆襲!使用 node.js 打造桌面環境!
 
Enjoy Writing Modern Desktop Application in JavaScript
Enjoy Writing Modern Desktop Application in JavaScriptEnjoy Writing Modern Desktop Application in JavaScript
Enjoy Writing Modern Desktop Application in JavaScript
 
軟體人甘苦談
軟體人甘苦談軟體人甘苦談
軟體人甘苦談
 
Let s Enjoy Node.js
Let s Enjoy Node.jsLet s Enjoy Node.js
Let s Enjoy Node.js
 
How to Write Node.js Module
How to Write Node.js ModuleHow to Write Node.js Module
How to Write Node.js Module
 

Node.js 進攻桌面開發