Aplicativos mobile com o AngularJS e Ionic

Aplicativos mobile com o AngularJS e Ionic

26 de agosto de 2016 0 Por Ramos de Souza Janones

Introdução

Os desenvolvedores web vem a cada dia mais se tornando desenvolvedores mobile. Isso vem acontecendo graças ao surgimento de tecnologias de desenvolvimento de aplicativos mobile hí­bridos, onde o desenvolvedor consegue utilizar as mesmas tecnologias já conhecidas por ele na web para criar aplicativos que rodem em múltiplas plataformas. Não necessitando aprender as linguagens nativas das plataformas mobile.

Atualmente existem várias tecnologias para desenvolvimento mobile onde o aplicativo é portado para diversas plataformas, como o Titanium, o PhoneGap, o Xamarin, o Delphi XE7, etc.

O Ionic Framework é uma dessas tecnologias e vem ganhando destaque nos últimos meses. O Ionic é um framework front-end open source que utiliza o poder do HTML5 e do AngularJS para entregar uma experiência de usuário fluí­da e um rápido desenvolvimento.

Os aplicativos Ionic são baseados no Cordova, logo, os utilitários do Cordova podem ser usados para build, deploy e testes dos aplicativos.

Muitos me perguntam: “Porque não o Delphi XE?” ou “o Xamarin com C#?”. Não tenho uma resposta muito boa para estas duas questões, mas o Ionic Framework possui mais componentes (apesar de não serem visuais), há todo um suporte do Google, é muito mais rápido de testar a aplicação e encontrar os erros, o desenvolvimento é muito mais rápido, a curva de aprendizado também. O que demora mesmo é o backend e a comunicação com o mesmo. Mas nestas outras linguagens não muda muito este cenário e pode, inclusive, ser ainda mais demorado. Prefiro a rapidez (se comparado com estas outras linguagens) e criação de interfaces mais livres (esta outras linguagens são muito amarradas a interface de usuário) e o uso do Cordova para tornarmos aplicativos híbridos e uma comunidade, no Exterior, ativa. 

Segundo uma pesquisa da Stack Overflow, site de discussão sobre programação mais relevante do mundo, o JavaScript é a linguagem de programação mais popular no mundo em 2016.

PHP cai uma posição e Node e Angular emergem com força (O Ionic Framework é baseado em Javascript, Node e Angular).

Delphi, apesar de não ser a mais usada, é a mais comum de outras tecnologias que não estão emergindo ou na liderança.

Java e C# ainda são lideres mundiais, perdendo apenas para o Javascript e SQL.:

Mas estas estatísticas não tem nada a ver com o que iniciei falando, é apenas uma estatística.

Por que o Ionic?

“Mas por que usar o Ionic se eu posso utilizar o Onsen UI ou o fazer tudo do zero em cima do Cordova?”. Existem algumas caracteríticas do Ionic que vão ajudar a responder essa questão:

  1. O Ionic trabalha muito bem com o AngularJS. Os componentes de interface do Ionic são diretivas do AngularJS. Além disso o Ionic utiliza o UI-Router para gerenciar as rotas e estados das views. Ao utilizar o Ionic você pode manter múltiplos históricos de navegação dentro de seu aplicativo, permitindo que você crie aplicativos com navegação não linear.
  2. Todo o CSS é gerado a partir do SASS e foi projetado para ser sobrescrito, tornando-o mais fácil para desenvolvedores personalizarem seus aplicativos. O CSS do Ionic é independente da camada de JavaScript, permitindo uma maior liberdade no desenvolvimento. Ele utiliza um sistema de grids baseado no Flexbox do CSS3, onde é possível criar layouts com qualquer quantidade de colunas e, inclusive, alinhar o conteúdo verticalmente dentro das colunas.
  3. Ele utiliza o Gulp para automatização de tarefas, como compilar o código SASS em CSS.
  4. O framework é obcecado por performance, com uma interface rápida e consistente. Ele utiliza recursos de aceleração de hardware e busca manipular minimamente o DOM.
  5. Não possui depedência do jQuery, embora você possa adicioná-lo caso queira.
  6. Por ser um framework front-end, é possí­vel utilizar os navegadores para o desenvolvimento. Fazendo bom uso das ferramentas de debug presentes nos navegadores é possí­vel desenvolver boa parte dos aplicativos (tudo o que não façaa uso das APIs nativas dos dispositivos móveis).
  7. Comunidade forte e ativa. Como o AngularJS é, atualmente, o framework javascript mais popular entre os desenvolvedores front-end, grande parte desses desenvolvedores optam por utilizar o Ionic e isso acaba fortalecendo cada dia mais a sua comunidade.

Instalação

Para utilizar o Ionic é necessário que você tenha o Node.js instalado.

Após instalar o Node.js é necessário instalar o Cordova e o Ionic através da seguinte linha de comando:

npm install -g cordova ionic

Assim que a instalação estiver completa você pode iniciar um novo projeto utilizando um template. Os templates disponí­veis são: blank, tabs e sidemenu. O primeiro é um template vazio, com o mí­nimo necessário para se ter um aplicativo Ionic, o segundo é um template que possui abas de navegação e o terceiro possui um menu lateral.

Para inicar um projeto utilizando um desses templates é só executar um dos comandos a seguir:

ionic start myApp blank
ionic start myApp tabs
ionic start myApp sidemenu

Onde myApp é o nome do aplicativo que você irá criar, ou seja, você pode substituí­-lo por qualquer outro nome. Poderia ser tableless ou tablelessApp por exemplo.

ionic start tablelessApp sidemenu

Após iniciar o aplicativo você deve adicionar as plataformas para o qual ele será publicado. Lembre-se que para desenvolver para iOS você precisa estar desenvolvendo em um Mac OS.

cd tablelessApp
ionic platform add ios
ionic platform add android

Agora você já pode fazer o build de seu aplicativo e executar ele no emulador da plataforma desejada.

ionic build ios
ionic emulate ios

Conclusão

Neste artigo nós vimos por que utilizar o Ionic Framework e como começar o desenvolvimento com o mesmo. Para que o artigo não fique muito extenso termino o mesmo por aqui, mas voltarei, em breve, com um tutorial onde explicarei como criar um aplicativo utilizando o Ionic.

Entretanto, fique a vontade para explorar as possibilidades do framework através dos links abaixo.

Recomendo o Ionic Brasil: https://github.com/IonicBrazil/guia-do-desenvolvedor

Site: https://ionicframework.com
Tutoriais: https://learn.ionicframework.com
Fórum: https://forum.ionicframework.com
GitHub: https://github.com/driftyco/ionic

 

LEIA TAMBÉM:  Javascript - Entenda Shadow DOM

Ramos de Souza Janones

Janones, é um empreendedor brasileiro apaixonado por empreendedorismo e tecnologia. Ao longo dos anos trabalhando com o desenvolvimento de softwares desktop desde a linguagem Clipper, passando pelo Delphi e atualmente com Java.

Optou pela formação de Publicidade e Marketing por sua segunda empresa de tecnologia ter participado do "boom" da internet nos anos 90 e na procura de melhorar seus conhecimentos em negócios.

Em razão da principal formação e profundos conhecimentos em programação e banco de dados, é capaz de realizar o desenvolvimento de aplicativos web, desktop e mobile com maior criatividade e inovação que profissionais de desenvolvimento com uma formação única e mais especifica, dedicada somente ao desenvolvimento de softwares.

Com toda sua experiência com empresas de software, sua formação e paixão por negócios escreveu o livro "Marketing para Empresas e Profissionais de Software", publicado pela editora carioca Ciência Moderna em 2012. Além de outros livros sobre programação.