Primeiros passos com Electron

Electron JS Primeiros passos

Quem sou? Raphael Porto @raphaelpor Cofundador da Desenvolvedor na Concrete
solutions Lithium

O que é o Electron? Framework para criar aplicações desktop,
usando tecnologias web como HTML, CSS e JavaScript.

Quem criou? GitHub

Para quê? Por isso, também é conhecido como Atom Shell
Atom Editor

Do que é feito? io.js + Chromium

Quem usa?

Instalação npm install ‐g electron‐prebuild

Estrutura do Projeto electrontestapp/ ├── package.json ├── main.js └── index.html

package.json { "name" : "electrontestapp" "version" : "0.1.0", "main" :
"main.js" }

index.html <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>Olá Mundo!</title> </head>
<body> <h1>Olá mundo!</h1> <small> io.js <script> </script> <br> Electron v<script> </script> <br> <script> </script> </small> </body> </html> document.write(process.version) document.write(process.versions['electron']) document.write(process.platform)

main.js var app = require('app'); var BrowserWindow = require('browserwindow'); require('crashreporter').start();
var mainWindow = null; app.on('windowallclosed', function() { if (process.platform != 'darwin') { app.quit(); } }); app.on('ready', function() { mainWindow = new BrowserWindow({width: 800, height: 600}); mainWindow.loadUrl('file://' + __dirname + '/index.html'); mainWindow.on('closed', function() { mainWindow = null; }); });

Acesse o código https://github.com/raphaelpor/electron-CS

Conheça mais - Electron Adventures - Awesome Electron - Electron
website

Primeiros passos com Electron

Primeiros passos com Electron

Raphael Porto

More Decks by Raphael Porto

Other Decks in Programming

Featured

Transcript

Electron JS Primeiros passos

Quem sou? Raphael Porto @raphaelpor Cofundador da Desenvolvedor na Concrete

O que é o Electron? Framework para criar aplicações desktop,

Quem criou? GitHub

Para quê? Por isso, também é conhecido como Atom Shell

Do que é feito? io.js + Chromium

Quem usa?

Instalação npm install ‐g electron‐prebuild

Estrutura do Projeto electrontestapp/ ├── package.json ├── main.js └── index.html

package.json { "name" : "electrontestapp" "version" : "0.1.0", "main" :

index.html <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>Olá Mundo!</title> </head>

main.js var app = require('app'); var BrowserWindow = require('browserwindow'); require('crashreporter').start();

Acesse o código https://github.com/raphaelpor/electron-CS

Conheça mais - Electron Adventures - Awesome Electron - Electron