Curso de Electron - Criação de aplicações desktop

Desenvolva aplicação desktop com o JavaScript

Nível Intermediário Categoria Desenvolvimento Back-end

Curso com 03h47 de videos
Certificado com 22 horas
27 exercícios

Sobre o curso

O JavaScript está em todo lugar, principalmente hoje em dia em que o desenvolvimento web é tão comum. Além do desenvolvimento web, também é comum vermos o uso de JavaScript para desenvolvimento de aplicativos mobile. Mesmo assim ainda há a necessidade de desenvolvermos aplicações Desktop em determinadas ocasiões.

O Electron nos permite usar nossos conhecimentos de desenvolvimento web para criar aplicações Desktop com HTML5, CSS3 e JavaScript. Ele também é usado por empresas como Microsoft, Facebook, GitHub e Slack.

Como estamos falando de uma aplicação instalada na máquina do usuário, não precisamos pedir permissões quando formos usar recursos como câmera, microfone, geolocalização, etc.

Neste curso iremos aprender como criar aplicações Desktop com Electron. Vamos conhecer as funcionalidades que ele nos fornece e como distribuir nossa aplicação

O que irá aprender?

Neste curso você verá como criar um aplicativo desktop em JavaScript. Com conteúdo apostilado e vídeo aulas, você verá em detalhes como montar uma aplicação Desktop com as tecnologias web. Também serão passados exercícios para que você possa fixar, praticar e aplicar o conteúdo aprendido.

Entre outras coisas você aprenderá:

Instalando o Ambiente;
Criando a primeira janela;
Diferenciação e Comunicação entre Main e Renderer;
Fazendo requisições e acessando páginas web;
Notificações, Menus e Dialogs nativos;
Teclas de Atalho, Shell e Área de Transferência;
Gerenciamento de arquivos, Mídia, Câmera e gravação de telas;
Projeto para fixação do aprendizado: Gerenciador de Imagens;
Empacotando e Distribuindo sua Aplicação;
Inicialização Automática da Aplicação.

Pra quem é esse curso?

Este curso é destinado àqueles que já tenham um conhecimento de HTML5, CSS3 e JavaScript e queiram melhorar suas técnicas de desenvolvimento, utilizando uma ferramenta que ajuda a criar aplicações Desktop para Mac, Linux e Windows com um único código.

Quais os pré-requisitos para esse curso?

Os pré-requisitos não são obrigatórios, são apenas sugestões. Eles dão uma base de parte do conhecimento que é interessante ter para um bom aproveitamento nesse curso.

Curso
JavaScript
Básico
06h15 Nível Iniciante
Curso
JavaScript
Intermediário
03h38 Nível Intermediário
Curso
JavaScript
Avançado
03h04 Nível Avançado
Curso
HTML5 e CSS3
Desenvolvimento web Básico
03h07 Nível Iniciante
Curso
Node.js
Completo
02h12 Nível Avançado

Metodologia

Videoaulas
Texto e imagens
Início Imediato
Testes de aprendizado

Ambiente do curso

Sublime Text 3.0.0 ou superior
Node.js 8.3.0 ou superior
Electron 1.7.5 ou superior

Sobre o professor

Akira Hanashiro

Professor especialista em Desenvolvimento Front-end na TreinaWeb. Akira, Felipe, Hana, Hanashiro ou Hanakira, é graduado em Análise e Desenvolvimento de Sistemas, pós-graduado em Projetos e Desenvolvimento de Aplicações Web e MBA em Machine Learning, é entusiasta no desenvolvimento de jogos e multi-task. Fala japonês fluente, mas não tem com quem conversar.

Curso
JavaScript
Básico
06h15 Nível Iniciante
Curso
JavaScript
Intermediário
03h38 Nível Intermediário
Curso
JavaScript
Avançado
03h04 Nível Avançado
Curso
HTML5 e CSS3
Desenvolvimento web Básico
03h07 Nível Iniciante
Curso
Node.js
Completo
02h12 Nível Avançado

Conteúdo programático

Conhecendo o Electron

Conheça o Electron, quem usa e porque usá-lo.
5 aulas
- O que é?
- Por que usar Electron?
- Por que desenvolver para Desktop hoje em dia?
- Quem usa? Casos de Sucesso
- Questionário
Preparando o Ambiente

Aprenda a instalar tudo o que precisamos para começar a trabalhar com o Electron.
2 aulas
- Instalando o Node.js
- Instalando o Electron
Criando a Primeira Janela

Veja como iniciar a sua primeira aplicação com Electron.
5 aulas
- Estrutura básica de uma aplicação Electron
- Criando a primeira janela
- Carregando a tela inicial
- Iniciando a primeira janela com Electron
- Carregando HTML na Janela
Entendendo o funcionamento do Electron

Conheça um pouco mais sobre como funciona o Electron.
4 aulas
- Como o Electron funciona?
- APIs do Node.js no Navegador
- Funcionalidades do Node.js no Navegador
- Questionário
Janelas

Vamos ver mais sobre tudo relacionado a janelas da aplicação.
11 aulas
- BrowserWindow
- Janela sem Frame
- Janela Transparente
- Aplicação sem Janela
- <webview>
- Janelas Filhas e Modais
- dialog
- Trabalhando com Janelas
- Relacionando Janelas
- Trabalhando com Dialogs
- Questionário
Tela e Gravação

Conheça as funcionalidades disponíveis para se trabalhar com a tela do computador e veja como gravar a tela do usuário.
5 aulas
- Screen
- desktopCapturer
- Mini Projeto: Capturando Telas e Janelas
- Mini Projeto: Streaming de Vídeo
- Mini Projeto: Armazenando Streaming e Salvando como Arquivo
Gerenciamento de Energia

Saiba como gerenciar as funcionalidades de energia.
3 aulas
- Gerenciando Energia
- powerMonitor
- powerSaveBlocker
Comunicação entre Main e Renderer

Aprenda a criar uma conexão entre os processos Main e Renderer.
7 aulas
- Comunicação entre Main e Renderer
- Comunicação ipcRenderer e ipcMain
- Acessando funcionalidades do Main no Renderer
- ipcRenderer
- ipcMain
- remote
- Questionário
App

Conheça as funções e propriedades do objeto App.
3 aulas
- Gerenciando a Aplicação
- Eventos
- Métodos
Teclas de Atalhos

Faça sua aplicação reagir ao pressionar teclas definidas como atalhos.
3 aulas
- Accelerator
- globalShortcut
- Questionário
Menu e ContextMenu

Aprenda a criar menus para dar mais poder e agilidade ao usuário.
7 aulas
- Trabalhando com Menus e ContextMenus
- MenuItem
- Roles dos Itens do Menu
- Menu
- ContextMenu
- Criando Menus e ContextMenus
- Questionário
Barra de Tarefas

Vamos aprender a criar ações que aparecem diretamente na barra de tarefas.
6 aulas
- A Barra de Tarefas
- ProgressBar
- Tasks
- ThumbarButton
- JumpLists
- Questionário
Notificações

Vamos trabalhar com notificações em nossa aplicação.
3 aulas
- Notification
- Menu na Área de Notificações
- Tray
Arquivos e Mídia

Trabalhe com arquivo e mídia.
8 aulas
- Arquivos e Mídia
- nativeImage
- File
- Soltando arquivos na aplicação
- Drag n’ Drop
- Acessando a Câmera do Usuário
- Camera
- Questionário
Clipboard

Veja como acessar a área de transferência.
2 aulas
- Área de Transferência
- Acessando a Área de Transferência
Shell

Execute comandos diretamente no console do sistema.
2 aulas
- Comandos do Shell
- Executando comandos do Shell
Requisições

Veja como mexer com requisições.
7 aulas
- Gerenciando Downloads
- DownloadItem
- Criando e Manipulando Requisições
- Fazendo Requisições
- WebRequest
- Online/Offline
- Questionário
Preparando a Aplicação para Distribuição

Aprenda a empacotar a sua aplicação para distribuí-la para seus clientes.
3 aulas
- Empacotando a Aplicação
- Criando Instaladores
- Inicialização Automática com o Sistema
Projeto: Gerenciador de Imagens

Vamos criar um projeto para fixar nosso aprendizado.
15 aulas
- Projeto: Apresentação e Estruturação
- Projeto: Criando o Main
- Projeto: Criando a Tela Principal
- Projeto: Gerenciando Diretórios
- Projeto: Listando Diretórios
- Projeto: Gerenciando Arquivos
- Projeto: Gerando Templates
- Projeto: Navegando entre Diretórios
- Projeto: Selecionando Arquivos
- Projeto: Inserindo Tray
- Projeto: Iniciando a Câmera
- Projeto: Salvando arquivos
- Projeto: Atalhos e PrintScreen
- Projeto: Comunicação entre Janelas
- Projeto: Desafio