SlideShare uma empresa Scribd logo
Desenvolvimento de
aplicativos híbridos
Wennder dos Santos
• Software developer
• Microsoft MVP
• Escreve no blog http://wenndersantos.net
• Publica vídeos em https://youtube.com/wenndersantos
• Slides em http://slideshare.net/wenndersantos
• Github https://github.com/wenndersantos
• @wenndersantos
Agenda dia 2
1. Automatize tudo
• Gulp
• Escrevendo as primeiras tasks
2. Testes automatizados (Testes de unidade)
• Por quê você não escreve testes?
• Jasmine
• Escrevendo um teste
• Karma
• Por quê é importante escrever testes?
https://github.com/WennderSantos/curso-apps-hibridos
Agenda dia 2
3. Testes de unidade não são os únicos
• Testes de UI
• Xamarin UI Test
• Escrevendo testes de UI
4. Xamarin test cloud
• O problema da quantidade de devices
• Teste seu app em 2000 dispositivos reais
https://github.com/WennderSantos/curso-apps-hibridos
Agenda dia 2
5. Continous integration
• Git
• Visual Studio Team Services (VSTS)
• Criando um build automatizado
6. Continous distribution
• HockeyApp
• VSTS, HockeyApp e o release contínuo
• Configurando um release contínuo
https://github.com/WennderSantos/curso-apps-hibridos
Agenda dia 2
7. Do desenvolvimento à store
• Assinando o app
• Publicando na play store
https://github.com/WennderSantos/curso-apps-hibridos
1 – Automatize tudo
http://gulpjs.com/
Gulp
npm i -g gulp
Gulp – Dentro da pasta do projeto
npm i --save-dev gulp
Gulp – Gulpfile
Crie um arquivo
com nome gulpfile.js
na raiz do projeto
Gulp – Primeira task: Compilar sass
npm i --save-dev gulp-sass
Gulp – Primeira task: Compilar sass
var gulp = require('gulp');
var sass = require('gulp-sass');
Gulp – Primeira task: Compilar sass
gulp.task('sass', function () {
gulp.src('./scss/ionic.app.scss')
.pipe(sass())
.pipe(gulp.dest('./www/css/'))
});
Gulp – Executando a task
Digite o seguinte comando
em seu terminal:
gulp sass
Gulp – Task default
gulp.task('default', ['sass']);
Gulp – Executando a task default
Digite o seguinte comando
em seu terminal:
gulp
2 – Testes automatizados
(Testes de unidade)
Por quê você não escreve testes?
• Não dá tempo
• Não vejo vantagem
• Não sei como fazer
• Testes de unidade
• Feedback rápido
• Garantem que uma regra de negócio funciona como
esperado
• Segurança para evoluir o código
Por quê é importante escrever testes?
Fazer isso é fácil
describe('Service: calculadoraService', function () {
var calculadoraService;
beforeEach(module(app'));
beforeEach(inject(function (_calculadoraService_) {
calculadoraService = _calculadoraService_;
}));
it('deve retornar 2 quando calcular 2 + 2', function () {
expect(calculadoraService.soma(2,2)).toBe(2);
});
});
Vamos escrever um teste
para você ver que é fácil
mesmo.
ionic create teste-unidade blank
cd ionic teste-unidade
Crie um projeto
Configure o ambiente
para rodar os testes
http://jasmine.github.io/
Jasmine
npm i --save-dev jasmine
Serviço que será testado –
www/js/services/calculadoraService.js
(function () {
angular
.module('starter')
.factory('calculadoraService', calculadoraService);
function calculadoraService() {
return {
soma: soma
};
function soma(numero1, numero2) {
return numero1 + numero2;
}
}
})();
O Teste –
www/js/services/calculadoraService.spec.js
(function () {
describe('Service: calculadoraService', function () {
var calculadoraService;
beforeEach(module('starter'));
beforeEach(inject(function (_calculadoraService_) {
calculadoraService = _calculadoraService_;
}));
it('soma deve retorna 2 quando somar 1 + 1', function () {
expect(calculadoraService.soma(1, 1)).toBe(2);
});
});
})();
https://karma-runner.github.io/1.0/index.html
Karma
npm -g karma-cli
npm i --save-dev karma
Karma – Criar o arquivo de
configuração (karma.conf.js)
karma init
Karma – Arquivos necessários para
executar os testes
• Ionic e suas denpedências
• Angular mocks
• Arquivos que serão testados
• Arquivos de testes
Angular mocks
npm i --save-dev angular-mocks
https://docs.angularjs.org/api/ngMock
Karma – Arquivos necessários para
executar os testes
files: [ 'www/lib/ionic/js/ionic.bundle.min.js',
'node_modules/angular-mocks/angular-mocks.js',
'www/js/**/*.js'
]
Dentro do arquivo karma.conf.js, adicione:
Karma – Executar os testes
karma start
Rodar os testes através do Gulp –
Instalando o modulo gulp-karma
npm i --save-dev gulp-karma
Rodar os testes através do Gulp –
Criando a task
var gulp = require('gulp');
var Server = require('karma').Server;
gulp.task('run-test', function () {
new Server({
configFile: __dirname + '/karma.conf.js',
singleRun: true
}).start();
});
Rodar os testes através do Gulp
gulp run-test
GitHub com o exemplo
https://github.com/WennderSantos/demo-teste-unidade-app-hibrido
Por quê é importante
escrever testes?
“Todo código escrito sem teste é um possível bug.”
Por quê é importante escrever testes?
Por quê é importante escrever testes?
Multiplataforma
Maiores frustrações de usuários
76%
71%
59%
0%
10%
20%
30%
40%
50%
60%
70%
80%
Maiores frustrações
MAIORES FRUSTRAÇÕES DE USUÁRIOS COM APLICATIVOS
MOBILE
Travamentos Crashes Lento/não-responsivo
http://apigee.com/about/press-release/apigee-survey-users-reveal-top-frustrations-lead-bad-mobile-app-reviews
O que os usuários fazem
44%
38%
32%
21%
0%
5%
10%
15%
20%
25%
30%
35%
40%
45%
50%
Ações tomadas
AÇÃO TOMADA A RESPEITO DE UM APLICATIVO RUIM
Deletam o app imediatamente Deletam o app se ele trava por mais de 30 seg.
Conta para amigos o quão ruim o app é Compartilha em redes sociais o quão ruim o app é
http://apigee.com/about/press-release/apigee-survey-users-reveal-top-frustrations-lead-bad-mobile-app-reviews
Desafios de apps multiplataforma com
qualidade
• 75% dos usuários não utilizam o app depois do primeiro dia
https://www.appboy.com/blog/app-customer-retention-spring-2016-report/
Testes de unidade não são os únicos
• Testes de unidade não garantem a cobertura de todas as
partes do seu sistema
Quantidade de testes por tipo
TESTES DE UI
Como escrever os testes de
UI de maneira automatizada?
Xamarin UITest
• Framework para escrita de testes de UI em C#
• Acesso a recursos do dispositivo
• Gestos e ações
• Manipula elementos na tela
Como escrever testes de UI
com o Xamarin UI Test?
• Abra o Visual Studio
• File >> New project >> Blank solution
• Add project >> Javascript >> Apache Cordova Apps >> Ionic
Tabs Template
• Add project >> Visual C# >> Test >> UI Test APP
(Xamarin.UITest | Android)
No projeto de testes
• Instale o pacote FluentAssertions
• Abra o arquivo Tests.cs
Informe aonde está o apk do
app
[SetUp]
public void BeforeEachTest()
{
app = ConfigureApp
.Android
.ApkFile("../../../DemoUiTest.Aplicativo/platforms/android/build/outputs/apk/android-debug.apk")
.StartApp();
}
Escreveremos testes para os
seguintes cenários
• Usuário deve conseguir navegar para tela Chats
• Usuário deve conseguir navegar para tela Accounts
• Usuário deve conseguir desativar amigos
• Usuário deve conseguir clicar no primeiro elemento da
lista
Usuário deve conseguir
navegar para tela Chats
[Test]
public void DeveNavegarParaTelaChats()
{
NavegarParaTelaChats();
var title = app.WaitForElement(x => x.WebView().Css("ion-header-bar .title"));
title.FirstOrDefault().TextContent.Should().Be("Chats");
}
private void NavegarParaTelaChats()
{
app.Tap(x => x.WebView().Css(".tab-item").Index(1));
}
Usuário deve conseguir
navegar para tela Accounts
[Test]
public void DeveNavegarParaTelaAccounts()
{
NavegarParaTelaAccounts();
var title = app.WaitForElement(x => x.WebView().Css("ion-header-bar .title"));
title.FirstOrDefault().TextContent.Should().Be("Account");
}
private void NavegarParaTelaAccounts()
{
app.Tap(x => x.WebView().Css(".tab-item").Index(2));
}
Usuário deve desativar amigos
[Test]
public void DeveDesativarAmigos()
{
NavegarParaTelaAccounts();
app.Tap(x => x.WebView().Css(".toggle"));
var labelFriends = app.WaitForElement(x => x.WebView()
.Css(".enableFriends span.ng-binding")).FirstOrDefault().TextContent;
labelFriends.Should().Contain("Enable Friends");
}
Usuário deve conseguir clicar no
primeiro elemento da lista
[Test]
public void DeveClicarNoPrimeiroElementoDaLista()
{
NavegarParaTelaChats();
app.Tap(x => x.WebView().Css(".item:first-of-type"));
var title = app.WaitForElement(x => x.WebView().Css(".title.title-left.header-item")).FirstOrDefault().TextContent;
title.Should().Be("Ben Sparrow");
}
GitHub com o exemplo
https://github.com/WennderSantos/demo-teste-ui-app-hibrido
UI Tests em todos dispositivos?
UI Tests em todos dispositivos?
http://www.idownloadblog.com/2013/07/30/the-terrible-state-of-android-fragmentation/
Xamarin Test Cloud
https://www.xamarin.com/test-cloud
Xamarin Test Cloud
• Dispositivos reais
• Testes automatizados em quantos dispositivos
precisar
• Dispositivos de várias marcas e modelos
• Resultado com logs e fotos
2000+ dispositivos reais
CONTINUOUS
INTEGRATION
http://martinfowler.com/articles/continuousIntegration.html
https://git-scm.com/
https://www.visualstudio.com/pt-br/products/visual-studio-team-services-vs.aspx
Criando uma build de
Continuous Integration
Criando uma build de Continuous
Integration
• Abra seu Visual Studio Team Services (VSTS)
• Crie um novo projeto com o templa Agile usando o
Git com controle de versão
• Envie seu repositório local para o VSTS
• Entre na Build e vamos começar uma nova definição
de build
Criando uma build de Continuous
Integration
• Clique no botão “New definition” e escolha o
template “Empty”
• Check o flag de “Contiuous integration”
Adicionando os steps que serão
executados na build
• Npm (install)
• Gulp (task bower)
• Gulp (task run-test)
• Cordova build (https://marketplace.visualstudio.com/items?itemName=ms-vsclient.cordova-extension)
CONTINUOUS
DISTRIBUTION
https://hockeyapp.net/
VSTS + HockeyApp
https://marketplace.visualstudio.com/items?itemName=ms.hockeyapp
HockeyApp – Integrando com VSTS
• Acesse sua conta no HockeyApp
• Account Settings e crie uma API Token com Full Access
• Entre no VSTS >> Team Settings e Adicione um Service
Endpoint do HockeyApp
• Informe um nome e Api token que foi criada.
Continuous distribution
• Na build de CI que criamos, adicione o step Copy Publish
Artifact
• No parâmetro “Content” use o minimach **apkandroid-
debug.apk
Criando o release automático
• Ainda no VSTS, entre na aba release
• Crie uma nova empty definition
• Selecione o nome da build que criamos há pouco e check o
flag de continuous deployment
• Adicione uma task do HockeyApp
DO DESENVOLVIMENTO
À STORE
ASSINANDO UM APP
• Gerar uma keystore (%JAVA_HOME%keytool -genkey -v -
keystore my-release-key.keystore -alias alias_name -keyalg
RSA -keysize 2048 -validity 10000)
ASSINANDO UM APP
https://github.com/WennderSantos/sign-android-windows
Faça o download dos arquivos desse repositório
ASSINANDO UM APP
• Coloque a Keystore e os aquivos .cmd em uma pasta dentro
da raiz do projeto.
• Execute o arquivo droi-release.cmd
• Informe a senha que foi colocada na criação do Keystore
COMO SUBMETER O APP
PARA A PLAY STORE?
Wennder dos Santos
wennder.santos@outlook.com
@wenndersantos

Mais conteúdo relacionado

Mais procurados

Workshop - Ionic + firebase
Workshop - Ionic + firebaseWorkshop - Ionic + firebase
Workshop - Ionic + firebase
Stefan Horochovec
 
Phonegap
PhonegapPhonegap
Phonegap
Lucas Aquiles
 
Palestra UFPR - Intro Ionic framework + WordPress
Palestra UFPR - Intro Ionic framework + WordPressPalestra UFPR - Intro Ionic framework + WordPress
Palestra UFPR - Intro Ionic framework + WordPress
Rômulo Zoch
 
SESTINFO 2011 Apresentacao Android
SESTINFO 2011 Apresentacao AndroidSESTINFO 2011 Apresentacao Android
SESTINFO 2011 Apresentacao Android
Rafael Sakurai
 
Phonegap, muito além dos nativos!
Phonegap, muito além dos nativos!Phonegap, muito além dos nativos!
Phonegap, muito além dos nativos!
Luiz Gavinho
 
Mini curso - Ionic Framework
Mini curso - Ionic FrameworkMini curso - Ionic Framework
Mini curso - Ionic Framework
juniorschroder
 
Desenvolvimento Multiplataforma com Appcelerator Titanium
Desenvolvimento Multiplataforma com Appcelerator TitaniumDesenvolvimento Multiplataforma com Appcelerator Titanium
Desenvolvimento Multiplataforma com Appcelerator Titanium
Dirlei Dionísio
 
Descomplicando o Mobile com Ionic Framework
Descomplicando o Mobile com Ionic FrameworkDescomplicando o Mobile com Ionic Framework
Descomplicando o Mobile com Ionic Framework
Yan Borowski Machado
 
Hybrid app phonegap angular ionic
Hybrid app   phonegap angular ionicHybrid app   phonegap angular ionic
Hybrid app phonegap angular ionic
Joelmir Ribacki
 
Introdução ao PhoneGap e Sencha Touch
Introdução ao PhoneGap e Sencha TouchIntrodução ao PhoneGap e Sencha Touch
Introdução ao PhoneGap e Sencha Touch
Rafael Neri
 
Minicurso de Desenvolvimento Híbrido utilizando Ionic Framework
Minicurso de Desenvolvimento Híbrido utilizando Ionic FrameworkMinicurso de Desenvolvimento Híbrido utilizando Ionic Framework
Minicurso de Desenvolvimento Híbrido utilizando Ionic Framework
Cristian Dean
 
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
 
Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...
Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...
Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...
Cássio Nandi Citadin
 
[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap
[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap
[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap
Loiane Groner
 
Introdução ao Titanium Appcelerator
Introdução ao Titanium AppceleratorIntrodução ao Titanium Appcelerator
Introdução ao Titanium Appcelerator
dfjorge
 
Firefox OS
Firefox OSFirefox OS
Firefox OS
Rafael Sakurai
 
Abra sua cabeça, apps híbridos - PhoneGap/Cordova
Abra sua cabeça, apps híbridos - PhoneGap/CordovaAbra sua cabeça, apps híbridos - PhoneGap/Cordova
Abra sua cabeça, apps híbridos - PhoneGap/Cordova
Gustavo Costa
 
Mini curso: Ionic Framework
Mini curso: Ionic FrameworkMini curso: Ionic Framework
Mini curso: Ionic Framework
Loiane Groner
 
PhoneGap
PhoneGapPhoneGap
Introdução ao Titanium Mobile
Introdução ao Titanium MobileIntrodução ao Titanium Mobile
Introdução ao Titanium Mobile
Eric Cavalcanti
 

Mais procurados (20)

Workshop - Ionic + firebase
Workshop - Ionic + firebaseWorkshop - Ionic + firebase
Workshop - Ionic + firebase
 
Phonegap
PhonegapPhonegap
Phonegap
 
Palestra UFPR - Intro Ionic framework + WordPress
Palestra UFPR - Intro Ionic framework + WordPressPalestra UFPR - Intro Ionic framework + WordPress
Palestra UFPR - Intro Ionic framework + WordPress
 
SESTINFO 2011 Apresentacao Android
SESTINFO 2011 Apresentacao AndroidSESTINFO 2011 Apresentacao Android
SESTINFO 2011 Apresentacao Android
 
Phonegap, muito além dos nativos!
Phonegap, muito além dos nativos!Phonegap, muito além dos nativos!
Phonegap, muito além dos nativos!
 
Mini curso - Ionic Framework
Mini curso - Ionic FrameworkMini curso - Ionic Framework
Mini curso - Ionic Framework
 
Desenvolvimento Multiplataforma com Appcelerator Titanium
Desenvolvimento Multiplataforma com Appcelerator TitaniumDesenvolvimento Multiplataforma com Appcelerator Titanium
Desenvolvimento Multiplataforma com Appcelerator Titanium
 
Descomplicando o Mobile com Ionic Framework
Descomplicando o Mobile com Ionic FrameworkDescomplicando o Mobile com Ionic Framework
Descomplicando o Mobile com Ionic Framework
 
Hybrid app phonegap angular ionic
Hybrid app   phonegap angular ionicHybrid app   phonegap angular ionic
Hybrid app phonegap angular ionic
 
Introdução ao PhoneGap e Sencha Touch
Introdução ao PhoneGap e Sencha TouchIntrodução ao PhoneGap e Sencha Touch
Introdução ao PhoneGap e Sencha Touch
 
Minicurso de Desenvolvimento Híbrido utilizando Ionic Framework
Minicurso de Desenvolvimento Híbrido utilizando Ionic FrameworkMinicurso de Desenvolvimento Híbrido utilizando Ionic Framework
Minicurso de Desenvolvimento Híbrido utilizando Ionic Framework
 
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
 
Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...
Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...
Desenvolvimento de aplicativos Mobile com HTML5 e Javascript com Phonegap (Te...
 
[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap
[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap
[Curso Phonegap / Cordova] Aula 01: Introdução ao Phonegap
 
Introdução ao Titanium Appcelerator
Introdução ao Titanium AppceleratorIntrodução ao Titanium Appcelerator
Introdução ao Titanium Appcelerator
 
Firefox OS
Firefox OSFirefox OS
Firefox OS
 
Abra sua cabeça, apps híbridos - PhoneGap/Cordova
Abra sua cabeça, apps híbridos - PhoneGap/CordovaAbra sua cabeça, apps híbridos - PhoneGap/Cordova
Abra sua cabeça, apps híbridos - PhoneGap/Cordova
 
Mini curso: Ionic Framework
Mini curso: Ionic FrameworkMini curso: Ionic Framework
Mini curso: Ionic Framework
 
PhoneGap
PhoneGapPhoneGap
PhoneGap
 
Introdução ao Titanium Mobile
Introdução ao Titanium MobileIntrodução ao Titanium Mobile
Introdução ao Titanium Mobile
 

Destaque

Contruindo Aplicações móveis com o Cordova e o Visual Studio
Contruindo Aplicações móveis com o Cordova e o Visual StudioContruindo Aplicações móveis com o Cordova e o Visual Studio
Contruindo Aplicações móveis com o Cordova e o Visual Studio
Wennder Santos
 
Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5
Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5
Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5
Intel Software Brasil
 
Mobile Dev - Aplicativos
Mobile Dev - AplicativosMobile Dev - Aplicativos
Mobile Dev - Aplicativos
Alex Espirito Santo
 
Angular.JS - Estado Atual
Angular.JS - Estado AtualAngular.JS - Estado Atual
Angular.JS - Estado Atual
Gustavo Costa
 
JavaScript: agora é sério
JavaScript: agora é sérioJavaScript: agora é sério
JavaScript: agora é sério
Luciano Ramalho
 
Intel XDK in Brief
Intel XDK in BriefIntel XDK in Brief
Intel XDK in Brief
Camilo Corea
 
INTEL XDK
INTEL XDKINTEL XDK
INTEL XDK
Sumit Rajpal
 
GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...
GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...
GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...
Patrick Chanezon
 
Desenvolvimento de Aplicativo Multiplataforma com Intel® XDK
Desenvolvimento de Aplicativo Multiplataforma com  Intel® XDKDesenvolvimento de Aplicativo Multiplataforma com  Intel® XDK
Desenvolvimento de Aplicativo Multiplataforma com Intel® XDK
Evandro Paes
 
Minicurso Intel XDK
Minicurso Intel XDKMinicurso Intel XDK
Minicurso Intel XDK
Diego Cavalca
 
HockeyApp: A plataforma para seus apps
HockeyApp: A plataforma para seus appsHockeyApp: A plataforma para seus apps
HockeyApp: A plataforma para seus apps
Wennder Santos
 
GDD Brazil 2010 - Google Storage, Bigquery and Prediction APIs
GDD Brazil 2010 - Google Storage, Bigquery and Prediction APIsGDD Brazil 2010 - Google Storage, Bigquery and Prediction APIs
GDD Brazil 2010 - Google Storage, Bigquery and Prediction APIs
Patrick Chanezon
 
Angular js com diretivas
Angular js com diretivasAngular js com diretivas
Angular js com diretivas
Matheus Lima
 
Apresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UIApresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UI
Cecília Rosa
 
Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...
Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...
Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...
Daniel Makiyama
 
Angular js
Angular jsAngular js
Angular js
Bruno Catão
 
Criando serviços com AngularJS
Criando serviços com AngularJSCriando serviços com AngularJS
Criando serviços com AngularJS
Rodrigo Branas
 
Programação Android - Básico
Programação Android - BásicoProgramação Android - Básico
Programação Android - Básico
HugoDalevedove
 
A evolução do AngularJS
A evolução do AngularJSA evolução do AngularJS
A evolução do AngularJS
Rodrigo Branas
 
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo BranasNode.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Rodrigo Branas
 

Destaque (20)

Contruindo Aplicações móveis com o Cordova e o Visual Studio
Contruindo Aplicações móveis com o Cordova e o Visual StudioContruindo Aplicações móveis com o Cordova e o Visual Studio
Contruindo Aplicações móveis com o Cordova e o Visual Studio
 
Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5
Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5
Desenvolvimento Apps multiplataforma para dispositivos móveis usando HTML5
 
Mobile Dev - Aplicativos
Mobile Dev - AplicativosMobile Dev - Aplicativos
Mobile Dev - Aplicativos
 
Angular.JS - Estado Atual
Angular.JS - Estado AtualAngular.JS - Estado Atual
Angular.JS - Estado Atual
 
JavaScript: agora é sério
JavaScript: agora é sérioJavaScript: agora é sério
JavaScript: agora é sério
 
Intel XDK in Brief
Intel XDK in BriefIntel XDK in Brief
Intel XDK in Brief
 
INTEL XDK
INTEL XDKINTEL XDK
INTEL XDK
 
GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...
GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...
GDD Brazil 2010 - What's new in Google App Engine and Google App Engine For B...
 
Desenvolvimento de Aplicativo Multiplataforma com Intel® XDK
Desenvolvimento de Aplicativo Multiplataforma com  Intel® XDKDesenvolvimento de Aplicativo Multiplataforma com  Intel® XDK
Desenvolvimento de Aplicativo Multiplataforma com Intel® XDK
 
Minicurso Intel XDK
Minicurso Intel XDKMinicurso Intel XDK
Minicurso Intel XDK
 
HockeyApp: A plataforma para seus apps
HockeyApp: A plataforma para seus appsHockeyApp: A plataforma para seus apps
HockeyApp: A plataforma para seus apps
 
GDD Brazil 2010 - Google Storage, Bigquery and Prediction APIs
GDD Brazil 2010 - Google Storage, Bigquery and Prediction APIsGDD Brazil 2010 - Google Storage, Bigquery and Prediction APIs
GDD Brazil 2010 - Google Storage, Bigquery and Prediction APIs
 
Angular js com diretivas
Angular js com diretivasAngular js com diretivas
Angular js com diretivas
 
Apresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UIApresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UI
 
Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...
Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...
Aprendendo Na Prática: Aplicativos Web com HTML5, Angular.js, Twitter Bootstr...
 
Angular js
Angular jsAngular js
Angular js
 
Criando serviços com AngularJS
Criando serviços com AngularJSCriando serviços com AngularJS
Criando serviços com AngularJS
 
Programação Android - Básico
Programação Android - BásicoProgramação Android - Básico
Programação Android - Básico
 
A evolução do AngularJS
A evolução do AngularJSA evolução do AngularJS
A evolução do AngularJS
 
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo BranasNode.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
 

Semelhante a Curso: Desenvolvimento de aplicativos híbridos (dia 2)

TDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no AndroidTDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no Android
tdc-globalcode
 
TDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no AndroidTDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no Android
tdc-globalcode
 
Automação de Teste em Front End - Caipira Ágil
Automação de Teste em Front End - Caipira ÁgilAutomação de Teste em Front End - Caipira Ágil
Automação de Teste em Front End - Caipira Ágil
Elias Nogueira
 
Teste para dispositivos móveis apresentação pra ufam -eliane
Teste para dispositivos móveis   apresentação pra ufam -elianeTeste para dispositivos móveis   apresentação pra ufam -eliane
Teste para dispositivos móveis apresentação pra ufam -eliane
Eliane Collins
 
Caipira agil automacao front end selenium
Caipira agil automacao front end seleniumCaipira agil automacao front end selenium
Caipira agil automacao front end selenium
Qualister
 
Talk testes em flutter
Talk testes em flutterTalk testes em flutter
Talk testes em flutter
Jhonatas Matos
 
Android Dev Conference 2017 - Automação de Testes na Cloud
Android Dev Conference 2017 - Automação de Testes na CloudAndroid Dev Conference 2017 - Automação de Testes na Cloud
Android Dev Conference 2017 - Automação de Testes na Cloud
iMasters
 
[DevOps Carioca] Testes Automatizados
[DevOps Carioca] Testes Automatizados[DevOps Carioca] Testes Automatizados
[DevOps Carioca] Testes Automatizados
Samanta Cicilia
 
Teste de Software - Bluesoft Labs
Teste de Software - Bluesoft Labs Teste de Software - Bluesoft Labs
Teste de Software - Bluesoft Labs
Ricardo Machado
 
Teste de software
Teste de software Teste de software
Teste de software
Allan Almeida de Araújo
 
Teste de software
Teste de softwareTeste de software
Teste de software
Rodrigo Cardoso Alves Fonte
 
4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades
4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades
4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades
Elias Nogueira
 
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
 
Agile Brazil 2018
Agile Brazil 2018Agile Brazil 2018
Agile Brazil 2018
Karla Silva
 
Apresentacao dev ops
Apresentacao dev opsApresentacao dev ops
Apresentacao dev ops
Carlos Wagner Costa
 
CNQS - Testes Automatizados & Continuous Delivery
CNQS - Testes Automatizados & Continuous DeliveryCNQS - Testes Automatizados & Continuous Delivery
CNQS - Testes Automatizados & Continuous Delivery
Samanta Cicilia
 
Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...
Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...
Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...
Douglas Leandro Kleinkauf
 
Keynote Visual Studio Summit 2016
Keynote Visual Studio Summit 2016Keynote Visual Studio Summit 2016
Keynote Visual Studio Summit 2016
Ramon Durães
 
Desenvolvendo aplicações orientadas a testes de aceitação: um caso prático
Desenvolvendo aplicações orientadas a testes de aceitação: um caso práticoDesenvolvendo aplicações orientadas a testes de aceitação: um caso prático
Desenvolvendo aplicações orientadas a testes de aceitação: um caso prático
elliando dias
 
Testes de Performance: Por Onde Começar?
Testes de Performance: Por Onde Começar?Testes de Performance: Por Onde Começar?
Testes de Performance: Por Onde Começar?
Alan Cafruni Gularte
 

Semelhante a Curso: Desenvolvimento de aplicativos híbridos (dia 2) (20)

TDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no AndroidTDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no Android
 
TDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no AndroidTDC2016POA | Trilha Android - Testes no Android
TDC2016POA | Trilha Android - Testes no Android
 
Automação de Teste em Front End - Caipira Ágil
Automação de Teste em Front End - Caipira ÁgilAutomação de Teste em Front End - Caipira Ágil
Automação de Teste em Front End - Caipira Ágil
 
Teste para dispositivos móveis apresentação pra ufam -eliane
Teste para dispositivos móveis   apresentação pra ufam -elianeTeste para dispositivos móveis   apresentação pra ufam -eliane
Teste para dispositivos móveis apresentação pra ufam -eliane
 
Caipira agil automacao front end selenium
Caipira agil automacao front end seleniumCaipira agil automacao front end selenium
Caipira agil automacao front end selenium
 
Talk testes em flutter
Talk testes em flutterTalk testes em flutter
Talk testes em flutter
 
Android Dev Conference 2017 - Automação de Testes na Cloud
Android Dev Conference 2017 - Automação de Testes na CloudAndroid Dev Conference 2017 - Automação de Testes na Cloud
Android Dev Conference 2017 - Automação de Testes na Cloud
 
[DevOps Carioca] Testes Automatizados
[DevOps Carioca] Testes Automatizados[DevOps Carioca] Testes Automatizados
[DevOps Carioca] Testes Automatizados
 
Teste de Software - Bluesoft Labs
Teste de Software - Bluesoft Labs Teste de Software - Bluesoft Labs
Teste de Software - Bluesoft Labs
 
Teste de software
Teste de software Teste de software
Teste de software
 
Teste de software
Teste de softwareTeste de software
Teste de software
 
4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades
4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades
4° Encontro Mensal ALATS: Automação de Teste - Mitos e Verdades
 
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
 
Agile Brazil 2018
Agile Brazil 2018Agile Brazil 2018
Agile Brazil 2018
 
Apresentacao dev ops
Apresentacao dev opsApresentacao dev ops
Apresentacao dev ops
 
CNQS - Testes Automatizados & Continuous Delivery
CNQS - Testes Automatizados & Continuous DeliveryCNQS - Testes Automatizados & Continuous Delivery
CNQS - Testes Automatizados & Continuous Delivery
 
Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...
Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...
Utilizando ferramentas de análise, testes e verificação de bugs no desenvolvi...
 
Keynote Visual Studio Summit 2016
Keynote Visual Studio Summit 2016Keynote Visual Studio Summit 2016
Keynote Visual Studio Summit 2016
 
Desenvolvendo aplicações orientadas a testes de aceitação: um caso prático
Desenvolvendo aplicações orientadas a testes de aceitação: um caso práticoDesenvolvendo aplicações orientadas a testes de aceitação: um caso prático
Desenvolvendo aplicações orientadas a testes de aceitação: um caso prático
 
Testes de Performance: Por Onde Começar?
Testes de Performance: Por Onde Começar?Testes de Performance: Por Onde Começar?
Testes de Performance: Por Onde Começar?
 

Mais de Wennder Santos

Testes de a a z
Testes de a a zTestes de a a z
Testes de a a z
Wennder Santos
 
Por que Xamarin?
Por que Xamarin?Por que Xamarin?
Por que Xamarin?
Wennder Santos
 
Meetup build 2017
Meetup build 2017Meetup build 2017
Meetup build 2017
Wennder Santos
 
Do desenvolvimento à store com React Native e VSTS
Do desenvolvimento à store com React Native e VSTSDo desenvolvimento à store com React Native e VSTS
Do desenvolvimento à store com React Native e VSTS
Wennder Santos
 
Azure WebJobs
Azure WebJobsAzure WebJobs
Azure WebJobs
Wennder Santos
 
Aplicativos híbridos e Xamarin Test Cloud
Aplicativos híbridos e Xamarin Test CloudAplicativos híbridos e Xamarin Test Cloud
Aplicativos híbridos e Xamarin Test Cloud
Wennder Santos
 
Azure Mobile Engagement
Azure Mobile EngagementAzure Mobile Engagement
Azure Mobile Engagement
Wennder Santos
 
Aplicativos híbridos e o Apache Cordova
Aplicativos híbridos e o Apache CordovaAplicativos híbridos e o Apache Cordova
Aplicativos híbridos e o Apache Cordova
Wennder Santos
 
HockeyApp: A Plataforma para seus apps
HockeyApp: A Plataforma para seus appsHockeyApp: A Plataforma para seus apps
HockeyApp: A Plataforma para seus apps
Wennder Santos
 

Mais de Wennder Santos (9)

Testes de a a z
Testes de a a zTestes de a a z
Testes de a a z
 
Por que Xamarin?
Por que Xamarin?Por que Xamarin?
Por que Xamarin?
 
Meetup build 2017
Meetup build 2017Meetup build 2017
Meetup build 2017
 
Do desenvolvimento à store com React Native e VSTS
Do desenvolvimento à store com React Native e VSTSDo desenvolvimento à store com React Native e VSTS
Do desenvolvimento à store com React Native e VSTS
 
Azure WebJobs
Azure WebJobsAzure WebJobs
Azure WebJobs
 
Aplicativos híbridos e Xamarin Test Cloud
Aplicativos híbridos e Xamarin Test CloudAplicativos híbridos e Xamarin Test Cloud
Aplicativos híbridos e Xamarin Test Cloud
 
Azure Mobile Engagement
Azure Mobile EngagementAzure Mobile Engagement
Azure Mobile Engagement
 
Aplicativos híbridos e o Apache Cordova
Aplicativos híbridos e o Apache CordovaAplicativos híbridos e o Apache Cordova
Aplicativos híbridos e o Apache Cordova
 
HockeyApp: A Plataforma para seus apps
HockeyApp: A Plataforma para seus appsHockeyApp: A Plataforma para seus apps
HockeyApp: A Plataforma para seus apps
 

Curso: Desenvolvimento de aplicativos híbridos (dia 2)

  • 2. Wennder dos Santos • Software developer • Microsoft MVP • Escreve no blog http://wenndersantos.net • Publica vídeos em https://youtube.com/wenndersantos • Slides em http://slideshare.net/wenndersantos • Github https://github.com/wenndersantos • @wenndersantos
  • 3. Agenda dia 2 1. Automatize tudo • Gulp • Escrevendo as primeiras tasks 2. Testes automatizados (Testes de unidade) • Por quê você não escreve testes? • Jasmine • Escrevendo um teste • Karma • Por quê é importante escrever testes? https://github.com/WennderSantos/curso-apps-hibridos
  • 4. Agenda dia 2 3. Testes de unidade não são os únicos • Testes de UI • Xamarin UI Test • Escrevendo testes de UI 4. Xamarin test cloud • O problema da quantidade de devices • Teste seu app em 2000 dispositivos reais https://github.com/WennderSantos/curso-apps-hibridos
  • 5. Agenda dia 2 5. Continous integration • Git • Visual Studio Team Services (VSTS) • Criando um build automatizado 6. Continous distribution • HockeyApp • VSTS, HockeyApp e o release contínuo • Configurando um release contínuo https://github.com/WennderSantos/curso-apps-hibridos
  • 6. Agenda dia 2 7. Do desenvolvimento à store • Assinando o app • Publicando na play store https://github.com/WennderSantos/curso-apps-hibridos
  • 10. Gulp – Dentro da pasta do projeto npm i --save-dev gulp
  • 11. Gulp – Gulpfile Crie um arquivo com nome gulpfile.js na raiz do projeto
  • 12. Gulp – Primeira task: Compilar sass npm i --save-dev gulp-sass
  • 13. Gulp – Primeira task: Compilar sass var gulp = require('gulp'); var sass = require('gulp-sass');
  • 14. Gulp – Primeira task: Compilar sass gulp.task('sass', function () { gulp.src('./scss/ionic.app.scss') .pipe(sass()) .pipe(gulp.dest('./www/css/')) });
  • 15. Gulp – Executando a task Digite o seguinte comando em seu terminal: gulp sass
  • 16. Gulp – Task default gulp.task('default', ['sass']);
  • 17. Gulp – Executando a task default Digite o seguinte comando em seu terminal: gulp
  • 18. 2 – Testes automatizados (Testes de unidade)
  • 19. Por quê você não escreve testes? • Não dá tempo • Não vejo vantagem • Não sei como fazer
  • 20. • Testes de unidade • Feedback rápido • Garantem que uma regra de negócio funciona como esperado • Segurança para evoluir o código Por quê é importante escrever testes?
  • 21. Fazer isso é fácil describe('Service: calculadoraService', function () { var calculadoraService; beforeEach(module(app')); beforeEach(inject(function (_calculadoraService_) { calculadoraService = _calculadoraService_; })); it('deve retornar 2 quando calcular 2 + 2', function () { expect(calculadoraService.soma(2,2)).toBe(2); }); });
  • 22. Vamos escrever um teste para você ver que é fácil mesmo.
  • 23. ionic create teste-unidade blank cd ionic teste-unidade Crie um projeto
  • 24. Configure o ambiente para rodar os testes
  • 27. Serviço que será testado – www/js/services/calculadoraService.js (function () { angular .module('starter') .factory('calculadoraService', calculadoraService); function calculadoraService() { return { soma: soma }; function soma(numero1, numero2) { return numero1 + numero2; } } })();
  • 28. O Teste – www/js/services/calculadoraService.spec.js (function () { describe('Service: calculadoraService', function () { var calculadoraService; beforeEach(module('starter')); beforeEach(inject(function (_calculadoraService_) { calculadoraService = _calculadoraService_; })); it('soma deve retorna 2 quando somar 1 + 1', function () { expect(calculadoraService.soma(1, 1)).toBe(2); }); }); })();
  • 30. Karma npm -g karma-cli npm i --save-dev karma
  • 31. Karma – Criar o arquivo de configuração (karma.conf.js) karma init
  • 32. Karma – Arquivos necessários para executar os testes • Ionic e suas denpedências • Angular mocks • Arquivos que serão testados • Arquivos de testes
  • 33. Angular mocks npm i --save-dev angular-mocks https://docs.angularjs.org/api/ngMock
  • 34. Karma – Arquivos necessários para executar os testes files: [ 'www/lib/ionic/js/ionic.bundle.min.js', 'node_modules/angular-mocks/angular-mocks.js', 'www/js/**/*.js' ] Dentro do arquivo karma.conf.js, adicione:
  • 35. Karma – Executar os testes karma start
  • 36. Rodar os testes através do Gulp – Instalando o modulo gulp-karma npm i --save-dev gulp-karma
  • 37. Rodar os testes através do Gulp – Criando a task var gulp = require('gulp'); var Server = require('karma').Server; gulp.task('run-test', function () { new Server({ configFile: __dirname + '/karma.conf.js', singleRun: true }).start(); });
  • 38. Rodar os testes através do Gulp gulp run-test
  • 39. GitHub com o exemplo https://github.com/WennderSantos/demo-teste-unidade-app-hibrido
  • 40. Por quê é importante escrever testes?
  • 41. “Todo código escrito sem teste é um possível bug.” Por quê é importante escrever testes?
  • 42. Por quê é importante escrever testes? Multiplataforma
  • 43. Maiores frustrações de usuários 76% 71% 59% 0% 10% 20% 30% 40% 50% 60% 70% 80% Maiores frustrações MAIORES FRUSTRAÇÕES DE USUÁRIOS COM APLICATIVOS MOBILE Travamentos Crashes Lento/não-responsivo http://apigee.com/about/press-release/apigee-survey-users-reveal-top-frustrations-lead-bad-mobile-app-reviews
  • 44. O que os usuários fazem 44% 38% 32% 21% 0% 5% 10% 15% 20% 25% 30% 35% 40% 45% 50% Ações tomadas AÇÃO TOMADA A RESPEITO DE UM APLICATIVO RUIM Deletam o app imediatamente Deletam o app se ele trava por mais de 30 seg. Conta para amigos o quão ruim o app é Compartilha em redes sociais o quão ruim o app é http://apigee.com/about/press-release/apigee-survey-users-reveal-top-frustrations-lead-bad-mobile-app-reviews
  • 45. Desafios de apps multiplataforma com qualidade • 75% dos usuários não utilizam o app depois do primeiro dia https://www.appboy.com/blog/app-customer-retention-spring-2016-report/
  • 46. Testes de unidade não são os únicos • Testes de unidade não garantem a cobertura de todas as partes do seu sistema Quantidade de testes por tipo
  • 48. Como escrever os testes de UI de maneira automatizada?
  • 49. Xamarin UITest • Framework para escrita de testes de UI em C# • Acesso a recursos do dispositivo • Gestos e ações • Manipula elementos na tela
  • 50. Como escrever testes de UI com o Xamarin UI Test? • Abra o Visual Studio • File >> New project >> Blank solution • Add project >> Javascript >> Apache Cordova Apps >> Ionic Tabs Template • Add project >> Visual C# >> Test >> UI Test APP (Xamarin.UITest | Android)
  • 51. No projeto de testes • Instale o pacote FluentAssertions • Abra o arquivo Tests.cs
  • 52. Informe aonde está o apk do app [SetUp] public void BeforeEachTest() { app = ConfigureApp .Android .ApkFile("../../../DemoUiTest.Aplicativo/platforms/android/build/outputs/apk/android-debug.apk") .StartApp(); }
  • 53. Escreveremos testes para os seguintes cenários • Usuário deve conseguir navegar para tela Chats • Usuário deve conseguir navegar para tela Accounts • Usuário deve conseguir desativar amigos • Usuário deve conseguir clicar no primeiro elemento da lista
  • 54. Usuário deve conseguir navegar para tela Chats [Test] public void DeveNavegarParaTelaChats() { NavegarParaTelaChats(); var title = app.WaitForElement(x => x.WebView().Css("ion-header-bar .title")); title.FirstOrDefault().TextContent.Should().Be("Chats"); } private void NavegarParaTelaChats() { app.Tap(x => x.WebView().Css(".tab-item").Index(1)); }
  • 55. Usuário deve conseguir navegar para tela Accounts [Test] public void DeveNavegarParaTelaAccounts() { NavegarParaTelaAccounts(); var title = app.WaitForElement(x => x.WebView().Css("ion-header-bar .title")); title.FirstOrDefault().TextContent.Should().Be("Account"); } private void NavegarParaTelaAccounts() { app.Tap(x => x.WebView().Css(".tab-item").Index(2)); }
  • 56. Usuário deve desativar amigos [Test] public void DeveDesativarAmigos() { NavegarParaTelaAccounts(); app.Tap(x => x.WebView().Css(".toggle")); var labelFriends = app.WaitForElement(x => x.WebView() .Css(".enableFriends span.ng-binding")).FirstOrDefault().TextContent; labelFriends.Should().Contain("Enable Friends"); }
  • 57. Usuário deve conseguir clicar no primeiro elemento da lista [Test] public void DeveClicarNoPrimeiroElementoDaLista() { NavegarParaTelaChats(); app.Tap(x => x.WebView().Css(".item:first-of-type")); var title = app.WaitForElement(x => x.WebView().Css(".title.title-left.header-item")).FirstOrDefault().TextContent; title.Should().Be("Ben Sparrow"); }
  • 58. GitHub com o exemplo https://github.com/WennderSantos/demo-teste-ui-app-hibrido
  • 59. UI Tests em todos dispositivos?
  • 60. UI Tests em todos dispositivos? http://www.idownloadblog.com/2013/07/30/the-terrible-state-of-android-fragmentation/
  • 62. Xamarin Test Cloud • Dispositivos reais • Testes automatizados em quantos dispositivos precisar • Dispositivos de várias marcas e modelos • Resultado com logs e fotos
  • 67. Criando uma build de Continuous Integration
  • 68. Criando uma build de Continuous Integration • Abra seu Visual Studio Team Services (VSTS) • Crie um novo projeto com o templa Agile usando o Git com controle de versão • Envie seu repositório local para o VSTS • Entre na Build e vamos começar uma nova definição de build
  • 69. Criando uma build de Continuous Integration • Clique no botão “New definition” e escolha o template “Empty” • Check o flag de “Contiuous integration”
  • 70. Adicionando os steps que serão executados na build • Npm (install) • Gulp (task bower) • Gulp (task run-test) • Cordova build (https://marketplace.visualstudio.com/items?itemName=ms-vsclient.cordova-extension)
  • 74. HockeyApp – Integrando com VSTS • Acesse sua conta no HockeyApp • Account Settings e crie uma API Token com Full Access • Entre no VSTS >> Team Settings e Adicione um Service Endpoint do HockeyApp • Informe um nome e Api token que foi criada.
  • 75. Continuous distribution • Na build de CI que criamos, adicione o step Copy Publish Artifact • No parâmetro “Content” use o minimach **apkandroid- debug.apk
  • 76. Criando o release automático • Ainda no VSTS, entre na aba release • Crie uma nova empty definition • Selecione o nome da build que criamos há pouco e check o flag de continuous deployment • Adicione uma task do HockeyApp
  • 78. ASSINANDO UM APP • Gerar uma keystore (%JAVA_HOME%keytool -genkey -v - keystore my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000)
  • 80. ASSINANDO UM APP • Coloque a Keystore e os aquivos .cmd em uma pasta dentro da raiz do projeto. • Execute o arquivo droi-release.cmd • Informe a senha que foi colocada na criação do Keystore
  • 81. COMO SUBMETER O APP PARA A PLAY STORE?

Notas do Editor

  1. Começaremos pelo gulp, que é conhecido como um build system. Usamos o gulp através de tasks que automatizam tarefas repetitivas que precisamos fazer no dia-a-dia do desenvolvimento. Com o gulp, conseguimos codar a configuração do projeto. O gulp oferece tudo através de plugin. Quer fazer algo? Com certeza existe um plugin para isso
  2. Agora que o básico para se mexer com Gulp está preparado, é hora do gulpfile.js
  3. Neste arquivo, é que as tasks ficam.
  4. Código que testa código! Isso é sensacional, afinal nosso trabalho é automatizar tudo o que for possível.
  5. Robert Martin (Clean code)
  6. Escrever testes não é duplicar o trabalho? Não! Sem testes, o trabalho de testar é manualmente e tomar muuito mais tempo. Sem contar que estaremos garantindo que algo que já funciona não vai parar de funcionar sem antes sabermos.
  7. Robert Martin (Clean code)
  8. Robert Martin (Clean code)
  9. Robert Martin (Clean code)
  10. Já escremos nosso teste, agora vamos execute-lo. Opa, mas como executamos um teste? Antes de mais nada, precisamos de runner.
  11. Com exceção do angular mocks, todos os outros já estão no projeto. Para que serve e como conseguir o angular mocks?
  12. Escrevemos nosso primeiro teste. Legal! Mas por quê eu deveria escrever testes? Na aula 1 nós vimos bastante sobre a existência de ferramentas especificas para resolver problemas especificos.
  13. Robert Martin (Clean code)
  14. Para garantir que os usuários tenham uma boa impressão do seu app, primeiramente ele tem que “só funcionar”. Para garantir isso, é indispensavel que seu código tenha testes.
  15. Com um minimo de esforço, rode os testes de seu app em uma infinidade de dispositivos diferentes (s.o, versões, fabricantes, tamanho de telas, etc)
  16. “Continuous integration é prática onde os membros de um time integram seu trabalho frequentemente ... Pelo menos uma vez por dia” Só que, é necessário que vários processos sejam executados para que seja a garantido que o trabalho que as pessoas estão fazendo separadamente não impacte um ao outro. Ou seja, ninguém pode quebrar o que já está funcionando. Para que isso seja possível, é indispensavel que o time utilize uma build de integração continua (CI). Onde, a cada nova atualização de um membro do time, um processo automatizado irá executar todos os passos e testes necessários e rapidamente dar um retorno para o time dizendo se tudo está ok.
  17. O lugar onde o código que todo o time mexe fica guardado é chamado de “repositório de código” Existem várias ferramentas que nos ajudam a organizar e trabalhar com esses repositórios. Uma dessas ferramentas é o GIT. Para começar a criar uma build de continuous integration, vamos escolher o git sistema de controle de versão. Distribuido
  18. Uma ferramenta que builda qlq coisa em qlq plataforma Totalmente extensivel através de plugins no marktplace
  19. “Continuous integration é prática onde os membros de um time integram seu trabalho frequentemente ... Pelo menos uma vez por dia” Só que, é necessário que vários processos sejam executados para que seja a garantido que o trabalho que as pessoas estão fazendo separadamente não impacte um ao outro. Ou seja, ninguém pode quebrar o que já está funcionando. Para que isso seja possível, é indispensavel que o time utilize uma build de integração continua (CI). Onde, a cada nova atualização de um membro do time, um processo automatizado irá executar todos os passos e testes necessários e rapidamente dar um retorno para o time dizendo se tudo está ok.
  20. Talvez tenha que liberar o auternate authentication credentials para usar o um git cliente fora do visual studio