Minicurso Ionic Apresentado na Faculdade Católica do Tocantins por Cristian Dean e Marcos Batista. O projeto utilizado de exemplo pode ser encontrado aqui: https://github.com/cristiandean/minucursocatolicaionic

1. CONSTRUINDO APPS HÍBRIDOS COM ANGULARJS E IONIC
CRISTIAN DEAN
MARCOS BATISTA

2. CRISTIAN DEAN
Sobre mim:
Tenho 22 anos, nasci e vivo em Paraíso do
Tocantins, sou formado em Sistemas de
Informação na Universidade do Tocantins e
pós-graduando em Gestão de Projetos. Desde
2009 trabalho como analista e desenvolvedor
de sistemas. Primeiramente era algo levado
como uma brincadeira e hoje é um dos
maiores portais do estado. Atualmente
trabalho em uma empresa privada de
d e s e n v o l v i m e n t o d e s o f t w a r e s d e
administração pública além de prestar
consultoria em mídia social e estar envolvido
com startups. cristiandean cristiandean
Habilidades:

3. MARCOS BATISTA
Sobre mim:
Tenho 27 anos, trabalho com desenvolvimento
de software web há 4 anos. Sou formado em
Sistemas de Informação pela ULBRA/Palmas e
pós-graduando em Gestão de Projetos.
Trabalhei na Fábrica de Software do Ceulp/
Ulbra, onde participei do desenvolvimento do
Portal Conecta e demais softwares para a
Instituição. Atualmente trabalho em uma
empresa privada como desenvolvedor de
sistemas para administração pública e
participo de startups.
markosystem markosystem
Habilidades:

4. VISÃO GERAL
1. Aplicativos web apps vs nativos vs híbridos
2. Introdução ao Ionic
3. UI Components
4. Ionic CLI
5. Cordova/Phonegap
6. Demos

5. Web App Nativo Híbrido

6. Web Híbrido Nativo
Desempenho/velocidade
Custo de Desenvolvimento (habilidades, infraestrutura)
Reusabilidade (código) / Portabilidade
Acessos ao Hardware do Dispositivo
Consistência da interface do usuário
- ✓ +
- - +
+ + -
- ✓ +
✓ ✓ +
Comparativo

7. WEB APPS

8. SDKS NATIVOS
SÃO ÓTIMOS!
Common UI, APIs, views, navigation, stack history,
transitions, interactions, gestures, etc

9. APPS HÍBRIDOS
HTML5 atua como código nativo
Acesso direto a APIs nativas
Um ambiente familiar com o desenvolvimento web
Uma única base de código (plataforma web)!

10. Aplicativo
Web View
Javascript
Código Nativo
Plugins
Contexto Nativo
Arquitetura

11. PLUGINS

12. Contexto Corporativo
• Precisa atender necessidades específicas
• Controle sobre o público atendido
• Time to Market
• Baixo Custo
• Manutenibilidade
• Interface Respeitando a Marca

14. Foco na construção do seu app
Não em como ele deve funcionar

15. TECNOLOGIAS WEB VOCÊ JÁ CONHECE
(Você se sentirá em casa)

16. QUEM UTILIZA?

17. TECNOLOGIAS WEB VOCÊ JÁ CONHECE
(Você se sentirá em casa)
Aproveitando o melhor do
ANGULAR
Estendendo o vocabulário HTML
Designado para o desenvolvimento de aplicações em larga escala
Componentes de interface usando Diretivas e Serviços

18. Cordova/PhoneGap
Apache Cordova/PhoneGap é uma API que
permite que o desenvolvedor tenha acesso a
funções nativas do dispositivo como a
câmera e acelerômetro, através do
JavaScript.

19. Plataformas

21. Adaptável à Plataforma

22. Como tudo isso fica junto?

23. npm -v
sudo npm install -g ionic cordova
ionic -v
ionic start --v2 appName
ionic serve
ionic build [android|ios|blackberry|osx|…]
ionic run [android|ios]
ionic g [page|provider] name
contato@teech.com.br

24. Mãos à Obra

26. Obrigado!