criando desktop apps com electron

47

Upload: emerson-thompson

Post on 13-Jan-2017

455 views

Category:

Presentations & Public Speaking


4 download

TRANSCRIPT

Page 1: Criando Desktop Apps com Electron
Page 2: Criando Desktop Apps com Electron

EMERSON THOMPSON

thompsonweb

thompsonemerson

Page 3: Criando Desktop Apps com Electron
Page 4: Criando Desktop Apps com Electron

Desktop Apps com

ELECTRON

Page 5: Criando Desktop Apps com Electron

QUEM FAZ SITE?

Page 6: Criando Desktop Apps com Electron

QUEM FAZ APP DESKTOP?

Page 7: Criando Desktop Apps com Electron
Page 8: Criando Desktop Apps com Electron

O que é o

ELECTRON?

Page 9: Criando Desktop Apps com Electron

Tecnologia Web

O Electron usa Chromium e Node.js para que você possa construir seus apps

com HTML, CSS e JavaScript

Page 10: Criando Desktop Apps com Electron

Open Source

O Electron é uma projeto Open Source mantido pelo Github e possui uma

comunidade ativa de colaboradores

Page 11: Criando Desktop Apps com Electron

Cross Platform

Compatível com Mac, Windows e Linux Pode ser construídos como executados

na 3 plataformas

Page 12: Criando Desktop Apps com Electron

Quem fez o

ELECTRON?

Page 13: Criando Desktop Apps com Electron
Page 14: Criando Desktop Apps com Electron

Como ele

FUNCIONA?

Page 15: Criando Desktop Apps com Electron
Page 16: Criando Desktop Apps com Electron

ECMASCRIPT 6?

Page 17: Criando Desktop Apps com Electron

http://blog.chromium.org/2016/04/es6-es7-in-browser.html

Page 18: Criando Desktop Apps com Electron

http://kangax.github.io/compat-table/es6/

Page 19: Criando Desktop Apps com Electron
Page 20: Criando Desktop Apps com Electron

Quem usa o

ELECTRON?

Page 21: Criando Desktop Apps com Electron

Github Atom Microsoft VS Code

Page 22: Criando Desktop Apps com Electron
Page 23: Criando Desktop Apps com Electron

Baixa Curva de Aprendizagem

Page 24: Criando Desktop Apps com Electron

Baixa Curva de Aprendizagem Cross-Platform

Page 25: Criando Desktop Apps com Electron

Baixa Curva de Aprendizagem Cross-Platform

Atualizações Automáticas

Page 26: Criando Desktop Apps com Electron

Baixa Curva de Aprendizagem Cross-Platform

Atualizações Automáticas

Acesso a APIs Nativas

Page 27: Criando Desktop Apps com Electron
Page 28: Criando Desktop Apps com Electron

Como iniciar

MEU APP

Page 29: Criando Desktop Apps com Electron

Electron Prebuilt$ npm install -g electron-prebuilt

Instala binários pré-construídos do Electron para uso da command-line usando NPM. Com esse módulo facilmente usará os comandos do Electron sem ter que compilar nada.

Page 30: Criando Desktop Apps com Electron

$ git clone https://github.com/electron/electron-quick-start

Clona o Quick Start

Page 31: Criando Desktop Apps com Electron

$ git clone https://github.com/electron/electron-quick-start

Clona o Quick Start

$ npm install

Instala as dependências

Page 32: Criando Desktop Apps com Electron

$ npm install

Instala as dependências

$ npm start

Executa o projeto

$ git clone https://github.com/electron/electron-quick-start

Clona o Quick Start

Page 33: Criando Desktop Apps com Electron
Page 34: Criando Desktop Apps com Electron
Page 35: Criando Desktop Apps com Electron
Page 36: Criando Desktop Apps com Electron
Page 37: Criando Desktop Apps com Electron
Page 38: Criando Desktop Apps com Electron

Como

BUILDAR?

Page 39: Criando Desktop Apps com Electron

Electron Packager é uma ferramenta de command-line usada para empacotar o código fonte do Electron app em

executáveis como .app ou .exe.

ELECTRON PACKAGER

Page 40: Criando Desktop Apps com Electron

ELECTRON BUILDER

Electron Builder é solução completa para preparar seu app para distribuição e 'atualização automática'

de apps Electron

Page 41: Criando Desktop Apps com Electron

ATUALIZAÇÃO AUTOMÁTICA?

Page 42: Criando Desktop Apps com Electron
Page 43: Criando Desktop Apps com Electron

Para turbinar

SEU APP

Page 44: Criando Desktop Apps com Electron

Ótimas Ferramentas da Comunidade

Electron Packager Buildar seus aplicativos

Electron Builder Fazer o deploy seus aplicativos

Spectron Testar seus aplicativos

Devtron Debugar seus aplicativos

Auto Launch Executa o app ao iniciar o OS

Electron Window State Salva tamanho e posição da tela

MenuBar Aplicativos menubar

Electron Reload Auto-Reload no desenvolvimento

Page 45: Criando Desktop Apps com Electron

https://github.com/sindresorhus/awesome-electron

Page 46: Criando Desktop Apps com Electron
Page 47: Criando Desktop Apps com Electron

@thompsonweb

OBRIGADO!