SlideShare uma empresa Scribd logo
1
Leandro Mancini
FrontEnd
WorkShop
2
FrontEnd
É responsável por
“dar vida” à
interface.
HTML (linguagem de marcação)
CSS (linguagem de estilo)
JavaScript (linguagem de script/programação)
Trabalha com a parte da
aplicação que interage
diretamente com o usuário.
3
Linguagens e
Frameworks
Nos últimos anos, esta área
também viu a introdução de
outras linguagens e frameworks,
como TypeScript, Angular,
Bootstrap, Sass, etc.
Que podem ser utilizadas de
acordo com as necessidades da
aplicação.
4
TypeScript
Subconjunto de
JavaScript
TypeScript é uma linguagem de programação criada e mantida pela Microsoft.
Basicamente é um subconjunto de JavaScript que acrescenta tipagem de objetos
(opcional), estrutura de classes e é totalmente baseada em programação orientada a
objeto.
Por ser um superconjunto do JavaScript, qualquer código dessa linguagem pode ser
colocado em um arquivo TypeScript.
5
Nativescript
É um framework open source
para construção de aplicativos
móveis nativos usando
JavaScript ou Typescript
Por que Nativescript ?
6
01 Desempenho nativo
UI bonita, acessível, nativa em
plataforma - sem WebViews.
03
Fácil de aprender
Use as habilidades da web que você já tem para
desenvolver aplicativos verdadeiramente nativos
com JavaScript, CSS e marcação de UI nativa.
02 Extensível
Reutilize facilmente os plug-ins
existentes do npm.
04
Plataforma cruzada
Escreva e implante aplicativos móveis
nativos para iOS e Android a partir de
uma única base de código.
05 Open Source
O NativeScript é 100% gratuito e de
código aberto.
7
npm install -g nativescript
Instalação
Após a instalação, a configuração do sistema deve ter:
JDK 8 e SDK para Android
8
Angular +
NativeScript = ❤
Com o NativeScript e o Angular,
uma única base de código pode
ser usada para criar aplicativos
da Web e aplicativos móveis
nativos com desempenho e
energia 100% nativos.
9
tns create <NomeDoProjeto>
Criando aplicativos
10
Passo 1
Acesse as configurações do Android,
deslize a tela até o fim e toque em
"Sobre o dispositivo".
Passo 2
No fim da tela, toque rapidamente
sete vezes seguidas sobre "Número
da versão". Faça isso até ver a
mensagem "Você agora é um
desenvolvedor".
Passo 3
Voltando à tela principal de
configurações, um novo menu
chamado "Programador" estará
disponível. Abra para ativar ou
desativar as ferramentas de
desenvolvedor.
Modo
Desenvolvedor
Como ativar a depuração
USB do Android
11
Executando
tns run android ou tns preview
12
Botão
Formulário
Imagem
Inventário
Página de login
13
Layouts
É a marcação base de
todas as visualizações que
fornecem posicionamento
de elementos filho.
14
Comandos CLI
Extensões de comando da
CLI do NativeScript para
adicionar alguns dos
comandos da CLI Angular.
Para gerar um componente, execute:
tns generate component <component-name>
Para criar um componente dentro de um módulo, execute:
tns generate component <component-name> <module-name>
Para criar um módulo, execute:
tns generate module <module-name>
Mão na massa
Mão na massa
Mão na massa
Mão na massa
Leandro Mancini
leandro.sousa@praxio.com.br
Obrigado

Mais conteúdo relacionado

Mais procurados

Iniciando com .NET no Visual studio 2013
Iniciando com .NET no Visual studio 2013Iniciando com .NET no Visual studio 2013
Iniciando com .NET no Visual studio 2013
Rogério Rodrigues
 
Ria e Java FX
Ria e Java FXRia e Java FX
Ria e Java FX
Marcelo Quinta
 
Desenvolvendo Windows Store Apps
Desenvolvendo Windows Store AppsDesenvolvendo Windows Store Apps
Desenvolvendo Windows Store Apps
Thiago Coelho
 
Introdução ao AngularJS - Minicurso
Introdução ao AngularJS - MinicursoIntrodução ao AngularJS - Minicurso
Introdução ao AngularJS - Minicurso
Márcio Lucas R Oliveira
 
JavaFX: A nova biblioteca gráfica da plataforma Java
JavaFX: A nova biblioteca gráfica da plataforma JavaJavaFX: A nova biblioteca gráfica da plataforma Java
JavaFX: A nova biblioteca gráfica da plataforma Java
jesuinoPower
 
Microsoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedor
Microsoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedorMicrosoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedor
Microsoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedor
Rodrigo Kono
 
SPA com CSharp
SPA com CSharpSPA com CSharp
SPA com CSharp
Gilmar Oliveira
 
Criando aplicações java fx em minutos
Criando aplicações java fx em minutosCriando aplicações java fx em minutos
Criando aplicações java fx em minutos
Bruno Oliveira
 
Apresentando meteor! Join Community - Goiânia
Apresentando meteor! Join Community - GoiâniaApresentando meteor! Join Community - Goiânia
Apresentando meteor! Join Community - Goiânia
Frederico Maia Arantes
 
Introdução ao React
Introdução ao ReactIntrodução ao React
Introdução ao React
Luiz Paulo dos Prazeres Júnior
 
JavaFX: Desktop para desenvolvedores WEB
JavaFX: Desktop para desenvolvedores WEBJavaFX: Desktop para desenvolvedores WEB
JavaFX: Desktop para desenvolvedores WEB
jesuinoPower
 
Chega de lendas! JavaFX em Android
Chega de lendas! JavaFX em AndroidChega de lendas! JavaFX em Android
Chega de lendas! JavaFX em Android
Bruno Oliveira
 
Meteor - Nunca foi tão fácil desenvolver pra web e mobile
Meteor - Nunca foi tão fácil desenvolver pra web e mobileMeteor - Nunca foi tão fácil desenvolver pra web e mobile
Meteor - Nunca foi tão fácil desenvolver pra web e mobile
Frederico Maia Arantes
 
5 frameworks para desenvolvimento de apps em html5
5 frameworks para desenvolvimento de apps em html55 frameworks para desenvolvimento de apps em html5
5 frameworks para desenvolvimento de apps em html5
daliarafaela
 
Phonegap
PhonegapPhonegap
Phonegap
Lucas Aquiles
 
Introdução ao .NET
Introdução ao .NETIntrodução ao .NET
Introdução ao .NET
Pedro Alves Jr.
 
Desenvolvimento rápido de aplicações com JEE e JavaFX
Desenvolvimento rápido de aplicações com JEE e JavaFXDesenvolvimento rápido de aplicações com JEE e JavaFX
Desenvolvimento rápido de aplicações com JEE e JavaFX
jesuinoPower
 
Aplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGap
Aplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGapAplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGap
Aplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGap
Thiago Colares
 
JavaFX - Uma visão Geral
JavaFX - Uma visão GeralJavaFX - Uma visão Geral
JavaFX - Uma visão Geral
Eder Nogueira
 
Phonegap ambiente de desenvolvimento
Phonegap ambiente de desenvolvimentoPhonegap ambiente de desenvolvimento
Phonegap ambiente de desenvolvimento
Aruã Sousa
 

Mais procurados (20)

Iniciando com .NET no Visual studio 2013
Iniciando com .NET no Visual studio 2013Iniciando com .NET no Visual studio 2013
Iniciando com .NET no Visual studio 2013
 
Ria e Java FX
Ria e Java FXRia e Java FX
Ria e Java FX
 
Desenvolvendo Windows Store Apps
Desenvolvendo Windows Store AppsDesenvolvendo Windows Store Apps
Desenvolvendo Windows Store Apps
 
Introdução ao AngularJS - Minicurso
Introdução ao AngularJS - MinicursoIntrodução ao AngularJS - Minicurso
Introdução ao AngularJS - Minicurso
 
JavaFX: A nova biblioteca gráfica da plataforma Java
JavaFX: A nova biblioteca gráfica da plataforma JavaJavaFX: A nova biblioteca gráfica da plataforma Java
JavaFX: A nova biblioteca gráfica da plataforma Java
 
Microsoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedor
Microsoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedorMicrosoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedor
Microsoft Expression Blend e WEB: sob o ponto de vista de um desenvolvedor
 
SPA com CSharp
SPA com CSharpSPA com CSharp
SPA com CSharp
 
Criando aplicações java fx em minutos
Criando aplicações java fx em minutosCriando aplicações java fx em minutos
Criando aplicações java fx em minutos
 
Apresentando meteor! Join Community - Goiânia
Apresentando meteor! Join Community - GoiâniaApresentando meteor! Join Community - Goiânia
Apresentando meteor! Join Community - Goiânia
 
Introdução ao React
Introdução ao ReactIntrodução ao React
Introdução ao React
 
JavaFX: Desktop para desenvolvedores WEB
JavaFX: Desktop para desenvolvedores WEBJavaFX: Desktop para desenvolvedores WEB
JavaFX: Desktop para desenvolvedores WEB
 
Chega de lendas! JavaFX em Android
Chega de lendas! JavaFX em AndroidChega de lendas! JavaFX em Android
Chega de lendas! JavaFX em Android
 
Meteor - Nunca foi tão fácil desenvolver pra web e mobile
Meteor - Nunca foi tão fácil desenvolver pra web e mobileMeteor - Nunca foi tão fácil desenvolver pra web e mobile
Meteor - Nunca foi tão fácil desenvolver pra web e mobile
 
5 frameworks para desenvolvimento de apps em html5
5 frameworks para desenvolvimento de apps em html55 frameworks para desenvolvimento de apps em html5
5 frameworks para desenvolvimento de apps em html5
 
Phonegap
PhonegapPhonegap
Phonegap
 
Introdução ao .NET
Introdução ao .NETIntrodução ao .NET
Introdução ao .NET
 
Desenvolvimento rápido de aplicações com JEE e JavaFX
Desenvolvimento rápido de aplicações com JEE e JavaFXDesenvolvimento rápido de aplicações com JEE e JavaFX
Desenvolvimento rápido de aplicações com JEE e JavaFX
 
Aplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGap
Aplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGapAplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGap
Aplicações Híbridas para Dispositivos Móveis com AngularJS e PhoneGap
 
JavaFX - Uma visão Geral
JavaFX - Uma visão GeralJavaFX - Uma visão Geral
JavaFX - Uma visão Geral
 
Phonegap ambiente de desenvolvimento
Phonegap ambiente de desenvolvimentoPhonegap ambiente de desenvolvimento
Phonegap ambiente de desenvolvimento
 

Semelhante a Workshop frontend

Construindo Aplicativos móveis conectados com Xamarin e Azure Mobile Services
Construindo Aplicativos móveis conectados com Xamarin e Azure Mobile ServicesConstruindo Aplicativos móveis conectados com Xamarin e Azure Mobile Services
Construindo Aplicativos móveis conectados com Xamarin e Azure Mobile Services
William S. Rodriguez
 
Desenvolvendo para Android
Desenvolvendo para AndroidDesenvolvendo para Android
Desenvolvendo para Android
Claudio Pereira
 
Introdução ao Android
Introdução ao AndroidIntrodução ao Android
Introdução ao Android
Diogo Soares Moreira
 
2017 08-11 - Androidos V - Minicurso - Introdução ao android
2017 08-11 - Androidos V - Minicurso - Introdução ao android2017 08-11 - Androidos V - Minicurso - Introdução ao android
2017 08-11 - Androidos V - Minicurso - Introdução ao android
Messias Batista
 
Asoso tipos de aplicações móveis (1)
Asoso   tipos de aplicações móveis (1)Asoso   tipos de aplicações móveis (1)
Asoso tipos de aplicações móveis (1)
grupouro
 
Asoso tipos de aplicações móveis (1)
Asoso   tipos de aplicações móveis (1)Asoso   tipos de aplicações móveis (1)
Asoso tipos de aplicações móveis (1)
grupouro
 
01 - Introdução a programação para internet v1.1
01 - Introdução a programação para internet v1.101 - Introdução a programação para internet v1.1
01 - Introdução a programação para internet v1.1
César Augusto Pessôa
 
Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...
Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...
Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...
William S. Rodriguez
 
Desenvolvimento de Aplicações com Visual Studio
Desenvolvimento de Aplicações com Visual StudioDesenvolvimento de Aplicações com Visual Studio
Desenvolvimento de Aplicações com Visual Studio
Geovani Ferreira Gonçalves
 
Latinoware 2019 - DEsenvolvimento mobile em Nivel jedi
Latinoware 2019 - DEsenvolvimento mobile em Nivel jediLatinoware 2019 - DEsenvolvimento mobile em Nivel jedi
Latinoware 2019 - DEsenvolvimento mobile em Nivel jedi
Alessandro Binhara
 
Aula 1 -_ambiente_visual_studio_2012
Aula 1 -_ambiente_visual_studio_2012Aula 1 -_ambiente_visual_studio_2012
Aula 1 -_ambiente_visual_studio_2012
Laís Vidal
 
Gt 10 FCSI- ambiente de desenvolvimento
Gt 10  FCSI- ambiente de desenvolvimentoGt 10  FCSI- ambiente de desenvolvimento
Gt 10 FCSI- ambiente de desenvolvimento
Max_Antonelli
 
Introdução intel XDK
Introdução intel XDKIntrodução intel XDK
Introdução intel XDK
Vicente Salgueiro Filho
 
Android Palestra
Android PalestraAndroid Palestra
Android Palestra
Renato
 
Escalando apps com React e Type Script e SOLID
Escalando apps com React e Type Script e SOLIDEscalando apps com React e Type Script e SOLID
Escalando apps com React e Type Script e SOLID
Ruben Marcus Luz Paschoarelli
 
Android - Conceito e Arquitetura
Android - Conceito e ArquiteturaAndroid - Conceito e Arquitetura
Android - Conceito e Arquitetura
Ana Dolores Lima Dias
 
Android - Notas de aula
Android - Notas de aulaAndroid - Notas de aula
Android - Notas de aula
antonio sérgio nogueira
 
Configurando o ambiente para desenvolvimento Android
Configurando o ambiente para desenvolvimento AndroidConfigurando o ambiente para desenvolvimento Android
Configurando o ambiente para desenvolvimento Android
CalebeMiquissene
 
Introdução a Plataforma Android
Introdução a Plataforma AndroidIntrodução a Plataforma Android
Introdução a Plataforma Android
Édipo Souza
 
Aplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile Apps
Aplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile AppsAplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile Apps
Aplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile Apps
William S. Rodriguez
 

Semelhante a Workshop frontend (20)

Construindo Aplicativos móveis conectados com Xamarin e Azure Mobile Services
Construindo Aplicativos móveis conectados com Xamarin e Azure Mobile ServicesConstruindo Aplicativos móveis conectados com Xamarin e Azure Mobile Services
Construindo Aplicativos móveis conectados com Xamarin e Azure Mobile Services
 
Desenvolvendo para Android
Desenvolvendo para AndroidDesenvolvendo para Android
Desenvolvendo para Android
 
Introdução ao Android
Introdução ao AndroidIntrodução ao Android
Introdução ao Android
 
2017 08-11 - Androidos V - Minicurso - Introdução ao android
2017 08-11 - Androidos V - Minicurso - Introdução ao android2017 08-11 - Androidos V - Minicurso - Introdução ao android
2017 08-11 - Androidos V - Minicurso - Introdução ao android
 
Asoso tipos de aplicações móveis (1)
Asoso   tipos de aplicações móveis (1)Asoso   tipos de aplicações móveis (1)
Asoso tipos de aplicações móveis (1)
 
Asoso tipos de aplicações móveis (1)
Asoso   tipos de aplicações móveis (1)Asoso   tipos de aplicações móveis (1)
Asoso tipos de aplicações móveis (1)
 
01 - Introdução a programação para internet v1.1
01 - Introdução a programação para internet v1.101 - Introdução a programação para internet v1.1
01 - Introdução a programação para internet v1.1
 
Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...
Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...
Mobile apps com Xamarin e Azure Mobile Services - The Developers Conference P...
 
Desenvolvimento de Aplicações com Visual Studio
Desenvolvimento de Aplicações com Visual StudioDesenvolvimento de Aplicações com Visual Studio
Desenvolvimento de Aplicações com Visual Studio
 
Latinoware 2019 - DEsenvolvimento mobile em Nivel jedi
Latinoware 2019 - DEsenvolvimento mobile em Nivel jediLatinoware 2019 - DEsenvolvimento mobile em Nivel jedi
Latinoware 2019 - DEsenvolvimento mobile em Nivel jedi
 
Aula 1 -_ambiente_visual_studio_2012
Aula 1 -_ambiente_visual_studio_2012Aula 1 -_ambiente_visual_studio_2012
Aula 1 -_ambiente_visual_studio_2012
 
Gt 10 FCSI- ambiente de desenvolvimento
Gt 10  FCSI- ambiente de desenvolvimentoGt 10  FCSI- ambiente de desenvolvimento
Gt 10 FCSI- ambiente de desenvolvimento
 
Introdução intel XDK
Introdução intel XDKIntrodução intel XDK
Introdução intel XDK
 
Android Palestra
Android PalestraAndroid Palestra
Android Palestra
 
Escalando apps com React e Type Script e SOLID
Escalando apps com React e Type Script e SOLIDEscalando apps com React e Type Script e SOLID
Escalando apps com React e Type Script e SOLID
 
Android - Conceito e Arquitetura
Android - Conceito e ArquiteturaAndroid - Conceito e Arquitetura
Android - Conceito e Arquitetura
 
Android - Notas de aula
Android - Notas de aulaAndroid - Notas de aula
Android - Notas de aula
 
Configurando o ambiente para desenvolvimento Android
Configurando o ambiente para desenvolvimento AndroidConfigurando o ambiente para desenvolvimento Android
Configurando o ambiente para desenvolvimento Android
 
Introdução a Plataforma Android
Introdução a Plataforma AndroidIntrodução a Plataforma Android
Introdução a Plataforma Android
 
Aplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile Apps
Aplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile AppsAplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile Apps
Aplicativos Corporativos Cross Plataform com Xamarin & Azure Mobile Apps
 

Último

Segurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas PráticasSegurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas Práticas
Danilo Pinotti
 
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
Faga1939
 
História da Rádio- 1936-1970 século XIX .2.pptx
História da Rádio- 1936-1970 século XIX   .2.pptxHistória da Rádio- 1936-1970 século XIX   .2.pptx
História da Rádio- 1936-1970 século XIX .2.pptx
TomasSousa7
 
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdfEscola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Gabriel de Mattos Faustino
 
Guardioes Digitais em ação: Como criar senhas seguras!
Guardioes Digitais em ação: Como criar senhas seguras!Guardioes Digitais em ação: Como criar senhas seguras!
Guardioes Digitais em ação: Como criar senhas seguras!
Jonathas Muniz
 
Logica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptxLogica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptx
Momento da Informática
 
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdfTOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
Momento da Informática
 

Último (7)

Segurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas PráticasSegurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas Práticas
 
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
 
História da Rádio- 1936-1970 século XIX .2.pptx
História da Rádio- 1936-1970 século XIX   .2.pptxHistória da Rádio- 1936-1970 século XIX   .2.pptx
História da Rádio- 1936-1970 século XIX .2.pptx
 
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdfEscola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
 
Guardioes Digitais em ação: Como criar senhas seguras!
Guardioes Digitais em ação: Como criar senhas seguras!Guardioes Digitais em ação: Como criar senhas seguras!
Guardioes Digitais em ação: Como criar senhas seguras!
 
Logica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptxLogica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptx
 
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdfTOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
 

Workshop frontend

  • 2. 2 FrontEnd É responsável por “dar vida” à interface. HTML (linguagem de marcação) CSS (linguagem de estilo) JavaScript (linguagem de script/programação) Trabalha com a parte da aplicação que interage diretamente com o usuário.
  • 3. 3 Linguagens e Frameworks Nos últimos anos, esta área também viu a introdução de outras linguagens e frameworks, como TypeScript, Angular, Bootstrap, Sass, etc. Que podem ser utilizadas de acordo com as necessidades da aplicação.
  • 4. 4 TypeScript Subconjunto de JavaScript TypeScript é uma linguagem de programação criada e mantida pela Microsoft. Basicamente é um subconjunto de JavaScript que acrescenta tipagem de objetos (opcional), estrutura de classes e é totalmente baseada em programação orientada a objeto. Por ser um superconjunto do JavaScript, qualquer código dessa linguagem pode ser colocado em um arquivo TypeScript.
  • 5. 5 Nativescript É um framework open source para construção de aplicativos móveis nativos usando JavaScript ou Typescript Por que Nativescript ?
  • 6. 6 01 Desempenho nativo UI bonita, acessível, nativa em plataforma - sem WebViews. 03 Fácil de aprender Use as habilidades da web que você já tem para desenvolver aplicativos verdadeiramente nativos com JavaScript, CSS e marcação de UI nativa. 02 Extensível Reutilize facilmente os plug-ins existentes do npm. 04 Plataforma cruzada Escreva e implante aplicativos móveis nativos para iOS e Android a partir de uma única base de código. 05 Open Source O NativeScript é 100% gratuito e de código aberto.
  • 7. 7 npm install -g nativescript Instalação Após a instalação, a configuração do sistema deve ter: JDK 8 e SDK para Android
  • 8. 8 Angular + NativeScript = ❤ Com o NativeScript e o Angular, uma única base de código pode ser usada para criar aplicativos da Web e aplicativos móveis nativos com desempenho e energia 100% nativos.
  • 10. 10 Passo 1 Acesse as configurações do Android, deslize a tela até o fim e toque em "Sobre o dispositivo". Passo 2 No fim da tela, toque rapidamente sete vezes seguidas sobre "Número da versão". Faça isso até ver a mensagem "Você agora é um desenvolvedor". Passo 3 Voltando à tela principal de configurações, um novo menu chamado "Programador" estará disponível. Abra para ativar ou desativar as ferramentas de desenvolvedor. Modo Desenvolvedor Como ativar a depuração USB do Android
  • 13. 13 Layouts É a marcação base de todas as visualizações que fornecem posicionamento de elementos filho.
  • 14. 14 Comandos CLI Extensões de comando da CLI do NativeScript para adicionar alguns dos comandos da CLI Angular. Para gerar um componente, execute: tns generate component <component-name> Para criar um componente dentro de um módulo, execute: tns generate component <component-name> <module-name> Para criar um módulo, execute: tns generate module <module-name>
  • 15. Mão na massa Mão na massa Mão na massa Mão na massa