Upload
raphael-porto
View
400
Download
1
Embed Size (px)
Citation preview
Desvendando o ElectronE brincando com o Polymer
Twitter: @raphaelporGitHub: @raphaelpor
O que veremos?1. O que é o Electron?
a. O que é?b. Quem o fez?c. Para quê?d. Vantagens.
2. Criando meu primeiro desktop app.a. Do que preciso?
i. Instalar o Electron.ii. Inserir o index.js.
b. Estrutura básica.c. Electron Quick Start.
3. Electron com Polymer.a. Por que?b. E como faz?
4. E agora?
O que é o Electron?
O que é?
Framework para criar aplicações desktop,
usando tecnologias web (HTML, CSS e JavaScript).
Quem o fez?
GitHub
Para quê?
Para criar o Atom, um editor escrito em Coffescript.Por isso, o Electron também é conhecido como Atom Shell.
Vantagens
➔ Shared code / UI➔ Atualizações automáticas➔ Acesso às APIs nativas➔ Fácil de integrar
Criando meu primeiro desktop app.
Do que preciso para começar?
1. Instalar o Electron.
$ npm i -g electron-prebuilt
2. Inserir um index.js.
index.js
Resultado:
Electron Quick Start
# Clone do repositório$ git clone https://github.com/atom/electron-quick-start
# Entre no diretório$ cd electron-quick-start
# Instale as dependências e rode$ npm install && npm start
Resultado:
Electron com Polymer.
Por quê?
➔ UI pronto (Material Design)➔ Não precisa de Polyfill, pois o Chrome dá suporte
aos WC’s.➔ Fácil de iniciar➔ Leve
E como faz?
# Clone do repositório$ git clone https://github.com/raphaelpor/electron-polymer-starter-kit
# Entre no diretório$ cd electron-quick-start
# Instale as dependências e rode$ npm install && bower install && npm start
Resultado:
E agora?
Guia do Desenvolvedor Electron no GitHub:https://github.com/electronbrasil/guia-do-desenvolvedor
Polytechnic Brazil:https://codelabs.developers.google.com/polytechnic-pt-br
Obrigado!