Front-end Developer⚡ Javascript <3

Mobile Development <3Hybrid Development <3

Gustavo Costa

'The top open source framework for building amazing mobile app’ - ionic.io

Ionic é um framework para criação de aplicativos híbridos

usando HTML, CSS e Javascript. Ele possui um conjunto

de componentes e funções prontas que nós podemos

usar e deixar nosso aplicativo mais funcional e atrativo.

Ecossistema

Core Values

28k stars Github

10.000 participantes canal slack

3.2M desenvolvedores acessaram o ionic.io em 2016

200+ contribuidores

$12.22M em 4 rounds de 6 investidores (23 funcionários)

+4 milhões de apps foram iniciados com o Angular CLI

União de duas plataformas

O Ionic une o melhor de duas grandes plataformas: Angular & Apache Cordova

1

Tecnologias Web

Com Ionic nunca foi tão fácil desenvolver um aplicativo

2

Produtividade, reaproveitamento e custo

Desenvolver software não é uma tarefa nada fácil, Ionic resolve muitos problemas para nós.

3

Tão popular, qual o motivo?

APACHE CORDOVAANGULAR

União de plataformas

UX/UI NATIVO

Angular - Ionic

Todos os componentes do Ionic são Componentes do Angular 1

Navegação e controle de rotas é feito pelo Angular2

Sistema de build (JIT/AOT) é feito pelo Angular3

Cordova - Ionic

<WebView>

Apache Cordova cria um aplicativo ‘nativo' que abre uma <WebView> 100%x100%, que abre nosso projeto 1

Como é um aplicativo nativo, temos acesso a qualquer API nativa2

O Apache Cordova provê uma interface de código nativo Swift/Java através de Javascript, os famosos plugins3

O 'Ionic Native' abstrai isso em serviços do Angular e notifica o sistema de mudanças do Angular via Observables

4

APACHE CORDOVAANGULAR

get best things

Primeiro framework para desenvolvimento multiplataforma estável.

1

Padrão UX/UI das plataformas

2

Muito fácil começar um projeto e utilizar uma API nativa.

3

IONIC 1 - ACERTOS

:)

Lento em alguns casos

1

Possui apenas o padrão de design do iOS

2

Sem suporte para web.

3

IONIC 1 - ERROS

:(

2.x

IONIC 2COMPONENTES

ionicframework.com/docs/v2/components

Próxima geração de Performance

AOT

Change Detection

Tree Shaking

Web Workers

IONIC 2NATIVE SCROLLING

IONIC 2ERROR REPORTING

IONIC 2TESTABLE

IONIC 2FRIENDS

IONIC 2PROGRESSIVE WEB APPS

IONIC 2ELECTRON

2.2

IONIC 2 - ACTIVE STATE+ BUGFIX + RESPONSIVE

2.4

IONIC 2 - ACTIVE STATE+ANGULAR 2.4

IONIC 2 - ACTIVE STATESplint Pane

IONIC 2 - ACTIVE STATEGrid, Flex box

HTML

JAVASCRIPT

CSS

O que preciso aprender?

COMECE HOJE!

FUTUREIONIC 3

FUTUREIONIC NATIVE

FUTUREANGULAR 4

OBRIGADO!

@GustavoCostaW

ionic.io