Construindo App Wrapper em PhoneGap (pt. 1)

O desenvolvimento de aplicativos que rodam em plataformas mobile como Android e iOS cresceu absurdamente nos últimos anos. Isso mostra claramente o interesse que companhias dos mais variados tipos têm em fazer com que você possua seus marcas na home screen do seu dispositivo.

Desenvolver um aplicativo Nativo pode sair caro, porém possui inúmeros benefícios. Para aqueles que pretendem seguir esse caminho mas precisam de uma alternativa rápida de acesso para seus usuários e que lhes proporcione maior número de acessos ou interatividade contínua com seus produtos, opções como o PhoneGap podem ser uma solução para os primeiros momentos.

Criando a base da aplicação

O que iremos fazer?

Não iremos desenvolver um aplicativo do zero, utilizando HTML, CSS e JS. Ao invés disso, iremos criar um app "casca" (Wrapper), que irá abrir uma página externa (seu site) e fazer o mesmo parecer como um aplicativo nativo, com ícones, tela de carregamento e funcionalidades idênticas ao do Browser.

Pre-requisitos

1 - Instale o PhoneGap

2 - Instale o emulador do Android Windows

3 - Instale o emulador do Android OS X

Criando a aplicação em PhoneGap (6.0.0)

Se você seguiu corretamente as instruções dos links acima, você está pronto para começar o desenvolvimento do aplicativo. Caso ocorra algum problema nos próximos passos, volte nas instruções de instalação e verifique se você não esqueceu nenhum passo ou instrução.

Primeiro iniciamos o projeto. Navegue até a pasta onde se encontram os seus projetos e digite:

phonegap create hello com.example.hello HelloWorld

Em seguida precisamos informar que tipo de sistemas operacionais iremos suportar. Para isso nós iremos rodar os seguintes comandos, que adicionam suporte para iOS e Android:

1 - phonegap platform add ios

2 - phonegap platform add android

Feito isso, rode os seguintes comandos para que possamos verificar se as plataformas foram adicionadas corretamente (lembre de possuir ambos os emuladores instalados, conforme informado na sessão de pré-requisitos):

1 - phonegap run ios --build

Emulador do iOS rodando

2 - phonegap run android --build

Emulador do Android rodando

Se você vê a tela dos emuladores conforme as imagens acima, significa que o processo até aqui foi um sucesso e você está pronto para a parte 2.

Continua na Parte 2

Autor:
Patrick muller
Patrick Müller
Líder Tecnológico na COSMIT. Já trabalhou com planejamento e desenvolvimento de diversas Startups ao longo dos últimos anos. Adora animes, desenhos antigos e aproveita boa parte do tempo livre em busca de conhecimento que possa ajudar seus clientes a atingirem seus objetivos.
Compartilhe: