Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Mobile Dev - Aplicativos

109 views

Published on

Desenvolvimento de aplicativos mobile híbridos
Apresentação realizada para os funcionários do Centro de Informática e Automação de Santa Catarina - CIASC

Published in: Software
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Get access to 16,000 woodworking plans, Download 50 FREE Plans... ■■■ http://tinyurl.com/yy9yh8fu
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Mobile Dev - Aplicativos

  1. 1. Mobile Dev Alex do Espírito Santo
  2. 2. Desenvolvimento Mobile Pensar em mobile é pensar nas pessoas Pensar em mobile é pensar no comportamento das pessoas
  3. 3. Desenvolvimento Mobile A internet é uma só, não há separação entre os meios digitais e o usuário está no centro.
  4. 4. Desenvolvimento Mobile Precisamos estar presente
  5. 5. Desenvolvimento Mobile Como ? Responsividade é uma opção
  6. 6. Desenvolvimento Mobile App ou Responsivo ? Como decidir ? Podemos Usar alguns Critérios: 1. Funcionalidades do dispositivo 2. Funcionamento offline 3. Descoberta 4. Velocidade 5. Instalação 6. Manuntenção 7. Independência da plataforma 8. Restrição de conteúdo, processo de aprovação e taxas 9. Custo de desenvolvimento 10. Interface do usuário 11. Estratégia de Marketing
  7. 7. Desenvolvimento Mobile Decidimos por app ! E o que fazer diante disso ?
  8. 8. Desenvolvimento Mobile O que preciso aprender ? S.O. Dispositivos Linguagem 1 iOS iPod, iPhone, iPad Objective-C Swift 2 Android * Java (DART ?) 3 Blackberry Blackberry devices C/C++/Qt, JavaScript/CCS/HT ML, ActionScript/AIR, Java Android 4 Windows Phone Windows C# 5 Palm WebOS HP HTML/CSS
  9. 9. Desenvolvimento Mobile O que preciso aprender ? S.O. Dispositivos Linguagem 6 Bada Samsung C++ 7 Symbian Nokia C++ 8 Amazon Fire OS Kindle Fire HDX, Fire Phone JAVA? (Android Open Source) 9 Firefox OS Alcatel, LG, ZTE HTML/CSS 10 Ubuntu Meizu MX4, BQ Aquaris E5 HD, BQ Aquaris E4.5 QML, C or C++ e JavaScript 11 Tizen Samsung Z1 Samsung ZQE9000 JavaScript, CSS, HTML5
  10. 10. Desenvolvimento Mobile Quais as principais Plataformas ?
  11. 11. Desenvolvimento Mobile E dá pra desenvolver uma vez e rodar em todos ? Framework/Suite Tipo de App Linguagem Pago 1 Phonegap Híbrido JS/HTML/CSS (Web) apenas serviços online 2 Apache Cordova Híbrido Web free 3 Xamarin Nativo C# free (agora) 4 Genexus Nativo Própria licença 5 Appacelarator Nativo Web licença 6 Sencha Touch Híbrido Web licença 7 Telerik Híbrido Web licença 8 Delphi Nativo Object Pascal licença 9 Ionic Híbrido Web serviços online
  12. 12. Desenvolvimento Mobile O que é um app híbrido ? Aproveitar o motor web existente nas plataformas, no S.O. dos dispositivos, para criação de aplicações com interface web que interajam com o dispositivo. O código html, javascript e css está embarcado no app. NÃO É SITE!!!
  13. 13. Desenvolvimento Mobile Como desenvolver aplicativos híbridos? Para o desenvolvimento App Híbrido é recomendado escolher um framework javascript para construir as ações do app. Os principais frameworks javascript para uso em conjunto com Cordova são:
  14. 14. Desenvolvimento Mobile Nome Onde ? 1 JQueryMobile http://jquerymobile.com/ 2 Framework7 - F7 http://www.idangero.us/framework7/#.Vddj-VNVik o 3 Sencha Touch https://www.sencha.com/products/touch/#overvie w 4 Chocolate-UI http://chocolatechip-ui.com/ 5 Ratchet http://goratchet.com/examples/ 6 Lungo http://lungo.tapquo.com/ 7 React http://facebook.github.io/react/ 8 Jo http://joapp.com/ Como desenvolver aplicativos híbridos?
  15. 15. Desenvolvimento Mobile Nome Onde ? 9 Junior http://justspamjustin.github.io/junior/#home 10 jQT http://jqtjs.com/ 11 Bootstrap http://getbootstrap.com/ 12 Famo.us https://famo.us/ 13 OnsenUI http://onsen.io/ 14 Intel XDK https://software.intel.com/en-us/intel-xdk 15 Mobile Angular UI http://mobileangularui.com/ 16 Ionic http://ionicframework.com/ Como desenvolver aplicativos híbridos?
  16. 16. Desenvolvimento Mobile Vamos usar Cordova Cerca de 2009 A Nitobi cria o framework PhoneGap Setembro 2011 Nitobi doa código do PhoneGap para a Apache Software Foundation Outubro 2011 Nitobi anuncia que foi adquirida pela Adobe. Adobe oferece suporte a código aberto do PhoneGap. Foi sugerido renomear o projeto por razões legais. Fevereiro 2012 O projeto mantido pela Apache é renomeado "Cordova", por causa de Cordova Street em Vancouver, onde Nitobi tinha a sua sede. História
  17. 17. Desenvolvimento Mobile Vamos usar Cordova É um conjunto de APIs que permitem acessar as funções do dispositivo, como a câmera ou o acelerômetro, a partir do JavaScript. Permite que um aplicativo seja desenvolvido apenas com HTML, CSS e JavaScript, ou seja, sem desenvolver qualquer código nativo (Java, Objective-C, etc) A partir do projeto com Cordova gera-se o aplicativo usando a SDK própria de cada plataforma mobile, que podem estar disponíveis para download na loja de aplicativos de cada fornecedor. Cordova está disponível para as plataformas: Android, iOS, Windows, BlackBerry, Ubuntu, Firefox, LG WebOS e FireOS. Em versões anteriores o Cordova já esteve disponível também para Palm WebOS, Bada, e Symbian
  18. 18. Desenvolvimento Mobile Plugins
  19. 19. Desenvolvimento Mobile Plugins
  20. 20. Desenvolvimento Mobile Escolhemos ...
  21. 21. Desenvolvimento Mobile E porque IONIC ? Mais do que código. Ionic é um Ecosistema ● Desenvolvido inspirado nas SDKs Nativas ● Construído para funcionar com o Cordova Um SDK Web
  22. 22. Desenvolvimento Mobile E porque IONIC ? 1. Trabalha muito bem com o AngularJS. 2. Utiliza o UI-Router para gerenciar as rotas e estados das views. permitindo que criar navegação não linear no app. 3. Todo o CSS é gerado a partir do SASS e foi projetado para ser sobrescrito. 4. Performance é obsessão, com uma interface rápida e consistente. Utiliza recursos de aceleração de hardware e manipula minimamente o DOM. 5. Não possui dependência do jQuery, embora seja possível adicioná-lo. 6. Permite utilizar as ferramentas de debug dos navegadores. 7. Comunidade forte e ativa, em parte pelo fato da utilização do AngularJS 8. Open Source
  23. 23. Desenvolvimento Mobile E porque IONIC ? 9. Componentes de UI próprios de cada plataforma (automático) 10. Componente de listagem que renderiza apenas os itens visíveis (collection-repeat) 11. Permite a navegação de voltar pelos botões da interface, pelo botão do aparelho ou puxando a tela 12. Mantém as Views em cache e o estado de cada tela, até mesmo a posição do scroll é mantida 13. Diversos Componentes de UI 14. +700 ícones disponíveis 15. SVGs Animados de loading que podem ser alterados com css http://ionicframework.com/
  24. 24. Desenvolvimento Mobile E porque IONIC ? ● ngCordova: biblioteca javascript que permite acessar recursos Cordova com diretivas Angular - http://ngcordova.com/
  25. 25. Desenvolvimento Mobile E porque IONIC ? Lab preview web de cada plataforma
  26. 26. Desenvolvimento Mobile E porque IONIC ?
  27. 27. Desenvolvimento Mobile E porque IONIC ?
  28. 28. Desenvolvimento Mobile E porque IONIC ? Cloud IONIC
  29. 29. Desenvolvimento Mobile E porque IONIC ?
  30. 30. Referências http://ionicframework.com/ https://www.owasp.org/index.php/Mobile#tab=Home http://giorgiofellipe.com.br/ionic-present http://www.luisaambros.com/blog/diferenca-entre-aplicativos-nativos-hibridos-e-mobile-web-apps/ http://mobilexpert.com.br/apps/outros/materias/13160/windows-supera-ios-no-brasil-android-continua-lider https://www.linkedin.com/pulse/20140612154131-26248656-ionic-framework-porque-utilizar

×