Recursos para Desenvolver Apps Híbridas

No seguimento das duas edições da Aula Prática de Aplicações Móveis Híbridas, e tendo em atenção as necessidades demostradas pelos participantes, criamos este post com algumas referências que podem ajudar todos aqueles que estão a iniciar-se no desenvolvimento deste tipo de aplicações.

Frameworks

Nestas aulas usamos três frameworks para desenvolver as nossas aplicações:

AngularJS

O AngularJS é uma framework MVC (ou MVW) para Single Page Applications sobre o qual o Ionic foi construído. Apresenta algumas características muito interessantes para o desenvolvimento de aplicações como Dependency Injection, Directives, Two-Way Data Binding, Templates em HTML.

Ionic

O Ionic é uma framework para desenvolvimento de aplicações móveis com HTML5, tem componentes CSS que primam pela qualidade tanto gráfica como de robustez e performance. Outros aspectos de referir é que está a ter um desenvolvimento rápido, acrescentando novos componentes, e adaptar-se às mudanças que estão a ocorrer ao nível do design para web e mobile, nomeadamente a especificação do Material Design lançada o ano passado pela Google.

PhoneGap

Por último, o PhoneGap é a framework responsável por gerar o código para as diferentes plataformas (Android, iOS, Windows Phone, etc...) a partir de uma única base de código em HTML, CSS e JavaScript. Além disso permite-nos ter acesso a dispositivos e funcionalidades que normalmente não teriamos acesso (contactos, persistência, acelerometro, câmera).

Para evitar a instalação local de todas as ferramentas de desenvolvimento (nomeadamente os SDKs), optamos por usar o serviço da Adobe PhoneGap Build para criar os ficheiros de instalação das aplicações.

Assim, basta fazer upload de um ficheiro .zip (ou indicar um link para um repositório no GitHub) com o nosso código em HTML, CSS e JavaScript e o serviço cria o ficheiro de instalação (.apk, .xap, etc...).

Recursos

Workflow

Desenvolver aplicações não é apenas escrever código, existem várias tarefas recorrentes que fazem parte do processo de desenvolvimento, como gerir dependências, minificação de código, gestão de versões, correr testes e até fazer reload do browser. Existem ferramentas que tornam todas estas tarefas mais simples e em alguns casos totalmente automatizadas.

  • GIT (controlo de versões)
  • Bower (gestão de dependências)
  • NPM (gestão de dependências, sobretudo desenvolvimento)
  • Gulp.js (automatização de tarefas)
  • Genymotion (um emulador de android mais rápido)

Outros Recursos

Estes são alguns dos recursos gratuitos. Existem várias fontes de informação não gratuítas que vale pena estar a par devido à sua qualidade. Os seguintes sites têm cursos sobre frameworks como AngularJS, Ionic, PhoneGap, assim como introduções a HTML, CSS e JavaScript.

Esta lista de recursos é só uma muito pequena parte do que está disponível na web e foca-se sobretudo na introdução a estes temas. No seguimento das próximas aulas e projectos do laborarório aberto iremos publicar mais recursos. Fiquem atentos!