"nw.js: введение в кросс-платформенные декстопные...

16
nw.js [email protected] github.com/broderix введение в кросс-платформенные десктопные приложения на javascript (node-webkit)

Upload: moscowjs

Post on 16-Jul-2015

331 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

nw.js

[email protected] github.com/broderix

введение в кросс-платформенные десктопные приложения на javascript

(node-webkit)

Page 2: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Я хочу свой текстовый редактор!

2

Page 3: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Существующие решения

1. Mono, Unity3D - C#, .Net2. Qt/Gtk - C/C++, js, python, php, bash3. tidesdk.org - js, python, php, ruby4. appjs.com -js5. Brackets Shell - js6. nw.js - js

3

Page 4: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Что такое nw.js

<html> <body> <h1>Content</h1> </body></html>

nw.js

4

Page 5: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

node-webkit

История проекта

io.js-chromium

nw.js

5

Page 6: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Установка и запуск$ npm install -g nw$ nw .

$ npm install -g generator-node-webkit$ yo node-webkit

6

Page 7: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Обзор API

● Window● Menu● Tray● Shell● Snapshots● HTML5 Stack: Notifications W3C, Audio, WebGL, etc● Platform specific: setBadge, requestAttention, Tile

7

Page 8: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

8

Как работает nw.js

require

Window Object

Render Thread

process

global ...

console document

alert ...

Page 9: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Контекст

9

Page 10: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Получаем доступ из io.js в chromium// In index.html<script> global.foo = function(){ console.log('Hello, moscowjs'); }; global.label = {text: 'label'}; require('mymodule.js');</script>

10

// In mymodule.jsglobal.foo();label.text = 'Hello, nw.js';

Page 11: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Сборка

npm install grunt-node-webkit-buildergrunt build

npm install appdmg grunt-appdmggrunt appdmg

www.jrsoftware.org/isinfo.php

osx

windows

11

Page 12: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Обновление приложения

● проверит версию● скачает архив (js, html, css, img) ● распакует архив● сообщит о результатах

npm install nw-updater

12

Page 13: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Пример$ echo '{

"name": "MoscowJS","main": "http://moscowjs.ru","window": {

"show": true,"toolbar": false

}}' > package.json$ nw .

13

Page 14: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Где использовать?

● обертка сайта● простые игры● хранение больших данных● фоновые процессы● ежедневные операции

14

Page 15: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Кто использует nw.js

1. Popcorn Time2. Intel® XDK3. DebugGap4. Tinder++5. Mongo Management Studio6. etc.

15

Page 16: "nw.js: введение в кросс-платформенные декстопные приложения на JavaScript", Кирилл Данилов, MoscowJS 20

Спасибо[email protected]

github.com/broderixtwitter.com/broderix

https://github.com/nwjs/nw.js