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
electron­testapp/
├── package.json
├── main.js
└── index.html
package.json
{
  "name"    : "electron­testapp"
  "version" : "0.1.0",
  "main"    : "main.js"
}
index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf­8">
    <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('browser­window');
require('crash­reporter').start();
var mainWindow = null;
app.on('window­all­closed', 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