Nos últimos anos, a IBM investiu fortemente no espaço móvel, assegurando o suporte aos seus principais produtos de software em vários dispositivos móveis, e também fornecendo ferramentas e tempos de execução do aplicativo para o desenvolvimento de aplicativos móveis. Com o IBM Worklight, a IBM pode expandir ainda mais suas capacidades móveis globais em todo o seu portfólio de produtos.

O IBM Worklight fornece uma plataforma de aplicativos móvel aberta, abrangente e avançada que pode ajudá-lo a desenvolver, executar e gerenciar, de forma eficaz, aplicativos HTML5, híbridos e nativos, usando tecnologias baseadas em padrões e ferramentas, middleware móvel otimizado, diversos mecanismos de segurança, gerenciamento integrado e capacidades analíticas.

Como introdução ao Worklight, este artigo estabelece o fluxo de trabalho básico do desenvolvedor de aplicativos móveis e mostra a configuração do ambiente Worklight para desenvolvimento de aplicativos. No processo, você será orientado sobre como desenvolver um simples aplicativo “Hello World”. A Parte 2 desta série mostrará como você pode usar esta configuração do ambiente com o desenvolvimento de aplicativo iterativo para criar um aplicativo funcional em torno do simples caso de uso da criação de um aplicativo de lista de tarefas (chamado “Todo”). Os artigos subsequentes incluirão a integração com outros produtos da IBM para mostrar as funções e recursos do Worklight.

Worklight básico

Faça o download do IBM Worklight Developer Edition 5.0 agora, sem nenhum custo e sem data de expiração!

O Worklight é uma Mobile Enterprise Application Platform (MEAP) inovadora que é parte integral da IBM Mobile Foundation. Há quatro componentes principais na plataforma do Worklight:

• IBM Worklight Studio é um IDE baseado em Eclipse para criar aplicativos Worklight;
• Componentes do IBM Worklight Device Runtime compõem o SDK que facilita o tempo de execução de aplicativos móveis no dispositivo;
• IBM Worklight Server é o servidor baseado em Java™que fornece conectividade segura a fontes de informação empresariais e da Internet;
• IBM Worklight Console é uma interface com o usuário baseada na web dedicada a ajudar no gerenciamento e monitoramento de todo o ecossistema de aplicativos móveis.

Estes componentes estão representados na Figura 1:

Resumindo, as tarefas de fluxo de trabalho que você cumpre ao desenvolver um aplicativo móvel são semelhantes às do desenvolvimento tradicional de aplicativos. Uma visão simplificada das etapas pode ter esta aparência (Figura 2):

1. Configure o Worklight e comece a desenvolver o aplicativo;
2. Continue com o processo de desenvolvimento e teste normal para verificar a funcionalidade do aplicativo, executando-o ou simulando-o;
3. Quando você achar que ele está pronto, envie o aplicativo de teste para obter o feedback dos usuários inovadores;
4. Com base no feedback, continue trabalhando na melhoria do aplicativo ou disponibilize-o para ser testado por um público maior;
5. Se você decidir expandir o uso do aplicativo de teste, é possível publicar o aplicativo para um conjunto restrito de usuários em um repositório de aplicativos local ou privado, ou para uma empresa ou repositório de aplicativos público (como a Apple App Store, Google Play, entre outras).

O restante deste artigo descreve como configurar o Worklight e os SDKs de dispositivos associados, e como criar um aplicativo de amostra vazio. O objetivo deste processo é assegurar que o aplicativo possa ser visto em um dispositivo e publicado em um servidor Worklight local. O resultado será a base para o desenvolvimento de futuros aplicativos móveis.

Configure o ambiente

O aplicativo de amostra que você desenvolverá é um aplicativo muito simples de “tarefas a fazer”, que permite ao usuário criar uma lista de tarefas simples que será exibida em uma tabela. O usuário poderá ver a data de cada tarefa, excluí-las e filtrar cada uma por palavra-chave. O front-end do aplicativo (gravado com o JQuery móvel) e outros detalhes do desenvolvimento do aplicativo serão descritos na Parte 2.

Embora seu objetivo final seja desenvolver um aplicativo de “tarefas a fazer”, o objetivo imediato deste artigo é estabelecer o fluxo de trabalho básico de desenvolvimento para criação, implantação e teste do aplicativo móvel em um simulador de dispositivo. Para fazer isso, é possível começar a trabalhar com o ambiente de desenvolvimento do Worklight em diversas etapas simples:

Download e instalação da versão mais recente do Eclipse Java Development Edition

Se for necessário fazer o download do Eclipse, é possível fazer isso no site Eclipse Downloads. Para o propósito do presente artigo, vamos assumir que você já tenha o Eclipse instalado. Para obter mais informações, consulte a Documentação de Introdução do Worklight.

Instalar plug-ins do Worklight Eclipse

Se você estiver familiarizado com a instalação de qualquer plug-in para o Eclipse, essa parte não será um problema. No Eclipse, navegue para Help > Install New Software e, em seguida, pressione o botão Add próximo à parte superior direita (Figura 3). No diálogo Add Repository, insira:

1. Name: Worklight Studio
2. Localização: http://public.dhe.ibm.com/ibmdl/export/pub/software/mobile-solutions/worklight/wdeupdate/

Continue com as próximas etapas apresentadas pelo assistente para fazer o download e instalar o ambiente necessário.

Instalar os SDKs específicos do dispositivo

Esta série de artigos mostrará o funcionamento do aplicativo Worklight para os dispositivos Android e iOS.

• Instalar o SDK do Android (opcional) – Siga as instruções no site do desenvolvedor do Android para instalar o SDK do Android e do simulador dentro da mesma shell do Eclipse como Worklight Studio.

• Instalar o SDK do iOS (opcional) – Siga as instruções no site do desenvolvedor da Apple para instalar o Xcode em uma máquina com o S.O. Mac. Se você não tiver um Mac, não será capaz de simular o aplicativo Worklight desenvolvido em um dispositivo iOS. As alternativas serão fornecidas em um artigo posterior usando as opções de Desenvolvimento do Worklight, mas, por agora, ignore as instruções específicas do iOS se você não tiver um Mac.

Inicie um novo projeto do Worklight

Agora, você deve ser capaz de criar um novo projeto de Worklight no Eclipse. Navegue para o File > New > Worklight Project, conforme mostrado na Figura 4. (Se o Projeto Worklight não for listado, tente em File > New > Other > Worklight Project.) Nome da sua pasta de projeto Todo Project.

Incluir um novo aplicativo para o projeto

Finalmente, é preciso incluir um novo aplicativo Worklight à pasta de aplicativos do seu projeto. Para isso, clique com o botão direito na pasta apps em Todo Project e selecione New > Worklight Application (Figura 5). (Se não estiver listado, tente em New > Other > Worklight Application.) Nome do aplicativo Todo.

O Worklight gerará automaticamente a estrutura do arquivo necessária para desenvolver o aplicativo Worklight. A pasta common é o local em que você colocará todos os arquivos necessários para criar seu aplicativo, incluindo os arquivos HTML, JavaScript™ e CSS. Nomeie o aplicativo ToDo e conclua esta parte da criação do aplicativo.

Instalar o servidor

Para testar o aplicativo que você está desenvolvendo, será necessário publicá-lo em um servidor Worklight local. Estas etapas o ajudarão a instalar o servidor Worklight. O IBM Worklight Studio V5 contém um servidor local que pode ser usado para testar o aplicativo criado acima, por meio do desenvolvimento e execução do aplicativo. Clique com o botão direito no aplicativo e selecione Build All and Deploy. Isso iniciará o servidor local na porta 8080, ative o projeto e implemente o aplicativo para testá-lo em um navegador.

É possível ver o progresso dos eventos no console (Figura 8).

Agora, é possível acessar o console do servidor do servidor local acessando http://localhost:8080/console em seu navegador. Você deve ver o aplicativo todo que acabou de implementar.

Desenvolver o aplicativo

Este aplicativo “Hello World” demonstrará a primeira iteração do desenvolvimento e simulação para ajudá-lo a se familiarizar com o processo, e será usado na Parte 2 para o preenchimento na tela real e lógica do aplicativo para o aplicativo Todo para mostrar o modelo de desenvolvimento completo do aplicativo Worklight. Para desenvolver este aplicativo inicial:

Selecione uma biblioteca JavaScript

A biblioteca JavaScript selecionada para este exemplo é o JQuery móvel. Você tem a opção de usar bibliotecas como o Dojo móvel ou Sencha Touch. Como uma alternativa, é possível desenvolver usando simplesmente o JavaScript puro e criar seu aplicativo a partir do zero.

Download das bibliotecas

Para este exemplo, é necessário fazer o download dessas bibliotecas JQuery:

1. JQuery 1.7.1
2. JQuery Mobile 1.1.0

Mova os arquivos no Worklight

Mova esses arquivos para o common/js:

1. o    jquery-1.7.1.min.js
2. o    jquery.mobile-1.1.0-rc.1.min.js

Mova esses arquivos para o common/css :

1. o    jquery.mobile-1.1.0-rc.1.css
2. o    jquery.mobile.structure-1.1.0-rc.1.min.css
3. o    jquery.mobile-1.1.0-rc.1/images

A Figura 11 mostra a estrutura do arquivo depois de os arquivos acima terem sido incluídos ao projeto Worklight.

Incluir código de modelo

A documentação de dispositivo móvel JQuery contém código clichê padrão para iniciar um aplicativo remoto simples (Figura 12). Certifique-se de que o aplicativo Todo contenha este código dentro das tags <body>.

Criar ambientes específicos do dispositivo

Como você pretende desenvolver o aplicativo Todo para os dispositivos Android e iPhone, será necessário criar um ambiente Worklight para cada tipo de dispositivo. Clique com o botão direito no elemento Todo e selecione Worklight > Worklight Environment e Next (Figura 13).

Escolha telefones e tablets iPhone e Android da lista e clique em Finish (Figura 12). Isto criará um projeto adicional para o Android e a estrutura adicional de pastas dentro do ToDo.

Desenvolver um aplicativo implementável para os dispositivos iOS e Android

O Worklight é estruturado com arquivos de origem comum (HTML, CSS e JavaScript) em uma pasta chamada common e os arquivos específicos da plataforma em seus respectivos diretórios; android para os arquivos Android, iphone para os arquivos do iPhone, e assim por diante. Por exemplo, já que o desenvolvimento do iOS e Android será feito usando o JQuery, o arquivo jquery.js estará em common/jquery.js. Se você tiver algum código específico do iOS, o código do JavaScript estará em ios-plugin.js e em iphone/js/iso-plugin.js ao invés de commonjs/iso-plugin.js. O Worklight assegurará a sincronização dos arquivos comuns em cada um dos ambientes de dispositivo específicos.

Depois de ter seu código fonte pronto para implantar, basta clicar com o botão direito em seu aplicativo Android e selecionar Run as… > Build All and Deploy (Figura 15). Uma nova pasta deverá aparecer na sua área de trabalho com o título de seu aplicativo: Nome do seu aplicativoAndroid.

Em seguida, clique com o botão direito no projeto e selecione Run as.. > Android Application (Figura 14). Se você tiver um telefone Android real conectado via USB com o modo de desenvolvedor ativado nas configurações, o aplicativo será executado automaticamente, caso contrário, ele será executado no AVD existente (Android Virtual Device). Isso ativará o emulador e exibirá a sequência do “Hello World” que você inseriu acima (Figuras 16 e 17).

As etapas para implementar o seu aplicativo em um dispositivo iOS são semelhantes ao processo do Android. Clique com o botão direito em seu aplicativo do iPhone e selecione Run as… > Build All and Deploy e, a seguir, clique em Run as XCode Project (Figura 18). Em Xcode, basta selecionar um dispositivo real, ou o simulador de iPhone ou iPad e, em seguida, clicar no botão Run (Figura 19). A Figura 20 mostra o aplicativo em execução em um ambiente de iPhone.

Conclusão

Neste artigo introdutório, você configura um ambiente de desenvolvimento do Worklight e desenvolve um simples aplicativo “Hello World” de amostra para o iPhone e Android. Como a configuração incluiu o tempo de execução do servidor Worklight e todo o software de suporte, você está pronto para começar a incluir lógica de aplicativo e conteúdo ao seu aplicativo Todo. Estas etapas forneceram uma visualização de como você percorrerá o fluxo de trabalho de desenvolvimento de criação de um aplicativo e fará os testes em um dispositivo ou simulador.

***

O IBM Worklight Developer Edition 5.0 simplifica o desenvolvimento de aplicativos da web nativos, híbridos e móveis em diversas plataformas de dispositivo móvel, incluindo iOS, Android, BlackBerry e Windows® Phone. Ele fornece recursos de desenvolvimento visual baseados no Eclipse e melhorias de código fonte para ajudar os desenvolvedores a acelerar o desenvolvimento, teste e entrega de aplicativos de dispositivo móvel usando tecnologias abertas como HTML5, Apache Cordova, JavaScript e as populares estruturas do JavaScript, como Dojo, jQuery, e Sencha Touch.