uma talk sobre o caso de sucesso do myinfoshare, usando ionic e couchdb em seu app mobile, Um startup de Brasilia e que aposta em novas tecnologias para melhor servir seus clientes.
2. pen4education
Aplicações off-line first
com Ionic e PouchDB
Essa palestra, aborda os desafios acerca
da criação de um chat com sincronia
offline e “realtime”, usando Couchdb,
Ionic e Pouchdb, com baixo custo.
3. pen4education
Who am I?
Itacir Ferreira Pompeu, ex-maratonista de programação
(ACM-ICPC), lutador de jiujitsu, professor de NodeJS na
Webschool.io, desenvolvedor “fullstack” no produto
MyInfoShare (Brasília), apaixonado por Opensource e
Linux, formado em TSI.
4. pen4education
Agenda
● O Produto MyInfoShare
● Couchdb
○ Sync e Replicate
○ How to Use
● Pouchdb
○ Open Source e JS
○ Simple Sync
○ Full Coverge
○ Api Simples
● Ionic
○ Como Funciona
○ Electron e Navegador
● Dicas Básicas
○ Autenticação e http
○ NodeJS e Express
● Considerações Finais
● Perguntas
5. pen4education
Introdução
• Javascript à frente de tudo, fui desafiado recentemente a
criar um chat mobile.
• Sockt.IO foi minha primeira opção, contudo, ao verificar a
real regra de negócio da aplicação, percebi que haveria
muito uso offline da aplicação.
• Como já havia “Brincado” com PouchDB, sugeri o uso,
comecei a pesquisá-lo, e hoje irei compartilhar com vocês
essa experiência.
9. pen4education
Entendendo o Conceito
Web Storage
“Web Storage: formas mais sofisticadas de manter informações no
navegador, que ficam disponíveis durante uma única sessão. Ao
invés de ter que buscar a informação no banco de dados
(percorrendo todo o caminho entre servidores), a informação é
requisitada para o próprio browser.”
<http://arquiteturadeinformacao.com/design-de-interacao/depois-de-
mobile-first-o-conceito-de-offline-first/> by: Fabricio Teixeira
10. pen4education
Entendendo o Conceito
App Cache
“App Cache: armazenar arquivos HTML, CSS, JS e imagens
para fazer sites e aplicativos funcionarem offline. A ideia é
controlar mais de perto o comportamento do Cache para
decidir quais arquivos devem ser armazenados e quando.”
<http://arquiteturadeinformacao.com/design-de-
interacao/depois-de-mobile-first-o-conceito-de-offline-first/>
by: Fabricio Teixeira
11. pen4education
Entendendo o CouchDB
Leia o livro disponível em: <http://guide.couchdb.org/draft/tour.
html>
Ele é um banco NOSQL, baseado em HTTP (rest), e
organizado em documentos.
Possui uma grande semelhança com Mongo, porem é escrito
em Erlang.
Possui Interface de comunicação simples, e pode ser
acessado pelo navegador.
14. pen4education
O PouchDB
O banco de dados que sincroniza!
PouchDB é um banco de dados JavaScript de código aberto
inspirado pelo Apache CouchDB, que é projetado para
funcionar bem dentro do navegador. O PouchDB foi criado
para ajudar os desenvolvedores web a criar aplicativos que
funcionam bem off-line como eles fazem online.
fonte: <https://pouchdb.com/>
15. pen4education
O PouchDB
Ele permite que os aplicativos armazenem dados localmente
enquanto off-line, em seguida, sincronizá-lo com o CouchDB e
servidores compatíveis quando a aplicação está de volta on-
line, mantendo os dados do usuário em sincronia, não importa
onde eles façam o próximo login.
fonte: <https://pouchdb.com/>
27. pen4education
O Ionic
“Ionic é um framework criado no final de 2013, que visa a
criação de aplicações híbridas para dispositivos móveis. Hoje,
o Ionic encontra-se na versão 1.3, que segundo a equipe por
trás do desenvolvimento, será o último release beta. Ele nada
mais é do que uma pilha de componentes e outros
frameworks.”
<http://tableless.com.br/introducao-ao-ionic-framework/> by:
grillorafael
28. pen4education
Dependencias
Deve-ser ter NodeJS instalando para usar o npm e
atravez dele instalar o apache cordova e ionic.
apt-get install nodejs && sudo npm i -g cordova ionic
O Ionic não e nada mais que a união de AngularJS
com um css baseado no design adaptativo de
acordo com a plataforma, hoje já esta sendo Ionic
2.
29. pen4education
Ionic how use
Lembrando para fazer build Android e Ios.
Deve-se ter os ambientes Java e Android no path
do Sistema operacional o IOS deve-se ter o
ambiente dele.
Caso queira pagar por isso Adobe reserva um
produto para build.