SlideShare a Scribd company logo
1 of 26
Download to read offline
Web tehnologije
u desktop
developmentu

Darko Kukovec
@DarkoKukovec
Hibridne aplikacije
● Web tehnologije + nativni wrapper
● Mobilne hibridne aplikacije
–
–

PhoneGap
Custom

● Desktop
Zašto hibridne
desktop aplikacije?
Razvoj za više platformi

•
•
•
•

Java
.NET + mono
QT
Hibridne aplikacije
Wrapperi
Adobe Air

•
•
•
•

Spor
Ograničeni developer toolsi
HTML5 + ActionScript
Distribucija: Izvršna datoteka
Qt

•
•

custom wrapper
HTML5 + nativni kod
–
–

•

–

C++
Python
JavaScript

Distribucija: Izvršna datoteka
Chrome Apps
● HTML5 + Chrome APIs
–

50+ API-ja

● Distribucija: Chrome Web Store
app.js

•
•
•
•

webkit + node.js
spori razvoj
HTML5 + node.js
Distribucija: izvršna datoteka
node-webkit
● Chromium + node.js
● brzi razvoj (Intel)
–
–

Chromium 30
node.js 0.10.18

● HTML5 + node.js
● Distribucija: izvršna datoteka
node-webkit

Getting started
Hello world!

•

Što je potrebno za izradu aplikacije
–
–
–

node-webkit
manifest
HTML, JS
Pokretanje i testiranje
● pokretanje
–
–

nw je u pathu
nw .

● testiranje
–
–

Chromedriver
Selenium
Debuggiranje
●
●
●
●

Chrome Developer Tools
DevTools jail
remote debugging
Sublime Text 2 konzola
Pakiranje i distribucija
● package.nw ili package.json u istoj mapi kao
i node-webkit izvršna datoteka
● pakiranje u izvršnu datoteku
–

–

Windows i Linux
●
napraviti node-webkit paket
●
Windows: copy /b nw.exe+app.nw app.exe
●
Linux: cat /usr/bin/nw app.nw > app && chmod +x app
OS X
●
kopirati aplikaciju u Contents/Resources mapu
unutar node-webkit aplikacije
Nativni elementi
● file dialozi
–

datoteke i mape

● otvaranje URL-a u defaultnom browseru
● otvaranje datoteke u defaultnoj aplikaciji ili u
file manageru
● menu bar / status bar
● pristup clipboardu
● kiosk mode
Tech stuff
Node.js promjene
● global → window
● Chromium konzola umjesto node.js konzole
● konflikti
–

–

node.js require i require.js
●
Rješenje: preimenovati window.require prije
učitavanja require.js
node.js crypto i blink crypto
Node.js moduli
● defaultni
–

require

● JavaScript
–
–

instalirati lokalno
node_modules

● C/C++
–
–
–

nw-gyp
ovisi o platformi
ovisi o verziji node-webkita
DOM promjene
● iframe
–
–
–

onemogućene sigurnosne značajke
omogućen node.js
Developer Tools
Zaštita koda
● v8 snapshot
–
–
–
–

može sakriti dio (nekoliko desetaka kB) koda u
binarnu datoteku
radi se za svaku platformu posebno
malo sporiji od običnog koda
učitava se prije običnog koda
Tko koristi
node-webkit

I koje njegove mogućnosti koristi
Tko koristi node-webkit
● Infinum :)
–
–

–

3 projekta (Windows i OSX)
Crypto
●
oko 50x brži od Adobe Air
Pristup optičkim medijima
●
detekcija i čitanje
Tko koristi node-webkit
● Gifrocket
–

kreiranje gif animacija iz videa

● Ambiance
–

code editor s modulima (npm)

● Arduinoscope
–
–

osciloskop za Arduino
pristup hardwareu

● Everytime
–
–

video bookmarking
komunicira sa VLC playerom
Što se može napraviti?
● Node.js + Chromium
Hvala na pažnji

More Related Content

Similar to Web tehnologije u desktop developmentu

Zašto nam treba PaaS u Srcu?
Zašto nam treba PaaS u Srcu?Zašto nam treba PaaS u Srcu?
Zašto nam treba PaaS u Srcu?Denis Kranjčec
 
Vert.x - Mihovil Rister, Javantura
Vert.x - Mihovil Rister, JavanturaVert.x - Mihovil Rister, Javantura
Vert.x - Mihovil Rister, JavanturaFive
 
Vert.x - asinkroni skalabilni i poliglotni framework nove generacije
Vert.x - asinkroni skalabilni i poliglotni framework nove generacijeVert.x - asinkroni skalabilni i poliglotni framework nove generacije
Vert.x - asinkroni skalabilni i poliglotni framework nove generacijeMihovil Rister
 
Heron MC - JavaScript for sysadmins and lazy developers
Heron MC - JavaScript for sysadmins and lazy developersHeron MC - JavaScript for sysadmins and lazy developers
Heron MC - JavaScript for sysadmins and lazy developersDavor Racić
 
Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...
Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...
Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...IT Showoff
 
[TVZ računarstvo] Dinamičke web aplikacije, predavanje 11.
[TVZ računarstvo] Dinamičke web aplikacije, predavanje 11. [TVZ računarstvo] Dinamičke web aplikacije, predavanje 11.
[TVZ računarstvo] Dinamičke web aplikacije, predavanje 11. Stipe Predanic
 
Razvoj Softvera Za Android Os
Razvoj Softvera Za Android OsRazvoj Softvera Za Android Os
Razvoj Softvera Za Android OsViktor Brešan
 
Izgradnja OS-a uporabom mikrojezgre
Izgradnja OS-a uporabom mikrojezgreIzgradnja OS-a uporabom mikrojezgre
Izgradnja OS-a uporabom mikrojezgreSenko Rašić
 
WinDays 13 - Internet Explorer 10 - san koji je postao java
WinDays 13 - Internet Explorer 10 - san koji je postao javaWinDays 13 - Internet Explorer 10 - san koji je postao java
WinDays 13 - Internet Explorer 10 - san koji je postao javaMatija Šmalcelj
 
Razvoj Air Mobilnih Aplikacija
Razvoj Air Mobilnih AplikacijaRazvoj Air Mobilnih Aplikacija
Razvoj Air Mobilnih AplikacijaIvan Ilijasic
 
MMS Video 2
MMS Video 2MMS Video 2
MMS Video 2jbozic
 
Panel diskusija - usporedba Web frameworka (IT Showoff)
Panel diskusija - usporedba Web frameworka (IT Showoff)Panel diskusija - usporedba Web frameworka (IT Showoff)
Panel diskusija - usporedba Web frameworka (IT Showoff)IT Showoff
 
Big Brother Hrvatska 2007 - Case Study - BizBuzz
Big Brother Hrvatska 2007 - Case Study - BizBuzzBig Brother Hrvatska 2007 - Case Study - BizBuzz
Big Brother Hrvatska 2007 - Case Study - BizBuzzwebburza
 
JavaCro14: Pakiranje i instalacija JEE rješenja
JavaCro14: Pakiranje i instalacija JEE rješenjaJavaCro14: Pakiranje i instalacija JEE rješenja
JavaCro14: Pakiranje i instalacija JEE rješenjaMiroslav Resetar
 

Similar to Web tehnologije u desktop developmentu (20)

JavaCro'15 - Integration of Mobile Applications with Facebook - Krešimir Mišu...
JavaCro'15 - Integration of Mobile Applications with Facebook - Krešimir Mišu...JavaCro'15 - Integration of Mobile Applications with Facebook - Krešimir Mišu...
JavaCro'15 - Integration of Mobile Applications with Facebook - Krešimir Mišu...
 
Zašto nam treba PaaS u Srcu?
Zašto nam treba PaaS u Srcu?Zašto nam treba PaaS u Srcu?
Zašto nam treba PaaS u Srcu?
 
Vert.x - Mihovil Rister, Javantura
Vert.x - Mihovil Rister, JavanturaVert.x - Mihovil Rister, Javantura
Vert.x - Mihovil Rister, Javantura
 
Javantura Zagreb 2014 - Vert.x 1.3 - Mihovil Rister
Javantura Zagreb 2014 - Vert.x 1.3 - Mihovil RisterJavantura Zagreb 2014 - Vert.x 1.3 - Mihovil Rister
Javantura Zagreb 2014 - Vert.x 1.3 - Mihovil Rister
 
Vert.x - asinkroni skalabilni i poliglotni framework nove generacije
Vert.x - asinkroni skalabilni i poliglotni framework nove generacijeVert.x - asinkroni skalabilni i poliglotni framework nove generacije
Vert.x - asinkroni skalabilni i poliglotni framework nove generacije
 
Heron MC - JavaScript for sysadmins and lazy developers
Heron MC - JavaScript for sysadmins and lazy developersHeron MC - JavaScript for sysadmins and lazy developers
Heron MC - JavaScript for sysadmins and lazy developers
 
JavaCro'14 - Developing Google Chromecast applications on Android – Branimir ...
JavaCro'14 - Developing Google Chromecast applications on Android – Branimir ...JavaCro'14 - Developing Google Chromecast applications on Android – Branimir ...
JavaCro'14 - Developing Google Chromecast applications on Android – Branimir ...
 
Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...
Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...
Ivan Guštin - Iskustva u optimizaciji IT Sustava primjenom Opensource rjesenj...
 
[TVZ računarstvo] Dinamičke web aplikacije, predavanje 11.
[TVZ računarstvo] Dinamičke web aplikacije, predavanje 11. [TVZ računarstvo] Dinamičke web aplikacije, predavanje 11.
[TVZ računarstvo] Dinamičke web aplikacije, predavanje 11.
 
Razvoj Softvera Za Android Os
Razvoj Softvera Za Android OsRazvoj Softvera Za Android Os
Razvoj Softvera Za Android Os
 
Izgradnja OS-a uporabom mikrojezgre
Izgradnja OS-a uporabom mikrojezgreIzgradnja OS-a uporabom mikrojezgre
Izgradnja OS-a uporabom mikrojezgre
 
WinDays 13 - Internet Explorer 10 - san koji je postao java
WinDays 13 - Internet Explorer 10 - san koji je postao javaWinDays 13 - Internet Explorer 10 - san koji je postao java
WinDays 13 - Internet Explorer 10 - san koji je postao java
 
JavaCro'15 - WebRTC in PBZ video chat - Zoran Perak
JavaCro'15 - WebRTC in PBZ video chat - Zoran PerakJavaCro'15 - WebRTC in PBZ video chat - Zoran Perak
JavaCro'15 - WebRTC in PBZ video chat - Zoran Perak
 
RSII_P6_2017_18.pdf
RSII_P6_2017_18.pdfRSII_P6_2017_18.pdf
RSII_P6_2017_18.pdf
 
JavaCro'14 - Packaging and installing of the JEE solution – Miroslav Rešetar
JavaCro'14 - Packaging and installing of the JEE solution – Miroslav RešetarJavaCro'14 - Packaging and installing of the JEE solution – Miroslav Rešetar
JavaCro'14 - Packaging and installing of the JEE solution – Miroslav Rešetar
 
Razvoj Air Mobilnih Aplikacija
Razvoj Air Mobilnih AplikacijaRazvoj Air Mobilnih Aplikacija
Razvoj Air Mobilnih Aplikacija
 
MMS Video 2
MMS Video 2MMS Video 2
MMS Video 2
 
Panel diskusija - usporedba Web frameworka (IT Showoff)
Panel diskusija - usporedba Web frameworka (IT Showoff)Panel diskusija - usporedba Web frameworka (IT Showoff)
Panel diskusija - usporedba Web frameworka (IT Showoff)
 
Big Brother Hrvatska 2007 - Case Study - BizBuzz
Big Brother Hrvatska 2007 - Case Study - BizBuzzBig Brother Hrvatska 2007 - Case Study - BizBuzz
Big Brother Hrvatska 2007 - Case Study - BizBuzz
 
JavaCro14: Pakiranje i instalacija JEE rješenja
JavaCro14: Pakiranje i instalacija JEE rješenjaJavaCro14: Pakiranje i instalacija JEE rješenja
JavaCro14: Pakiranje i instalacija JEE rješenja
 

Web tehnologije u desktop developmentu