Primeiros passos com Electron JS

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.

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

Do que é feito?
io.js + Chromium

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 JS

Recommandé

Recommandé

Contenu connexe

En vedette

En vedette (13)

Similaire à Primeiros passos com Electron JS

Similaire à Primeiros passos com Electron JS (20)

Primeiros passos com Electron JS