NativeScript
Desenvolvendo apps nativos com Angular
@alefesouza https://as.dev
Slide 2
Slide 2 text
Alefe Souza
Full Stack Developer, Instrutor
@alefesouza
https://as.dev
@alefesouza https://as.dev
Slide 3
Slide 3 text
Apps nativos?
Apps que utilizam componentes do próprio sistema
operacional e não WebViews.
@alefesouza https://as.dev
Slide 4
Slide 4 text
NativeScript
Ferramenta open source para desenvolvimento de
apps nativos para Android e iOS.
@alefesouza https://as.dev
Slide 5
Slide 5 text
Focado em tecnologias web
@alefesouza https://as.dev
Slide 6
Slide 6 text
@alefesouza https://as.dev
Slide 7
Slide 7 text
Plugins
Plugins de impressão digital, gerenciamento de
arquivos, mapas, SQLite, câmera, dentre outros.
@alefesouza https://as.dev
Slide 8
Slide 8 text
Também é possível chamar APIs nativas direto no
código JavaScript/TypeScript.
@alefesouza https://as.dev
let str = new java.lang.String('Hello world!');
let result = str.endsWith('world!');
console.log(result); // true
let button = new UIButton();
button.setTitleForState('Button title', UIControlStateNormal);
console.log(button.titleLabel.text);
Slide 9
Slide 9 text
Quem usa?
@alefesouza https://as.dev
Slide 10
Slide 10 text
Como iniciar?
● Playground
● CLI
● Sidekick
@alefesouza https://as.dev
Slide 11
Slide 11 text
PlayGround
Interface web ideal para demonstrações, você pode
codar direto no navegador e rodar no app oficial do
NativeScript com um QR Code.
@alefesouza https://as.dev
Slide 12
Slide 12 text
PlayGround
Para acessar o playground, acesse
https://play.nativescript.com e baixa o app
“NativeScript Playground”, escaneie o QR Code
no site e pronto, você já tem um ambiente de
desenvolvimento com hot reload.
@alefesouza https://as.dev
Slide 13
Slide 13 text
CLI
CLI escrita em node que funciona como o Angular
CLI, você tem total controle sobre o projeto e pode
fazer operações mais avançadas.
@alefesouza https://as.dev
Sidekick
Interface gráfica para a linha de comando, na qual
você pode rodar seu app e instalar plugins com um
simples clique.
@alefesouza https://as.dev
Slide 16
Slide 16 text
Live Code!
http://bit.ly/talk-nativescript
@alefesouza https://as.dev