Começando com Phone Gap (Cordova): Hello Word iOS

Hoje vamos aprender como configurar o ambiente no MacOS para começar a desenvolver com Phone Gap - agora conhecido como Cordova com o Xcode.

Atenção, este post está desatualizado!
Para phonegap 2, veja: http://www.loiane.com/2012/11/comecando-com-phone-gap-2-cordova-hello-word-ios/

Requisitos:

XCode (MacOS)
Phone Gap SDK

Passo a passo:

Instalar o plugin do Cordova no XCode
Criar uma aplicação
Implementar o Hello World
Executar no Emulador iOS
Próximos Passos

1 - Instalando o Plugin do Cordova (Phone Gap no XCode)

1.1 - Depois de fazer o download do Phone Gap (Cordova) no site, unzipe o arquivo e faça a instalação do arquivo dmg que se encontra dentro do diretório iOS - deixe o XCode fechado enquanto faz essa instalação.

2 - Criando uma Aplicação no XCode

2.1 - Abra o XCode e selecione criar um novo projeto. Selecione "Cordova based application" e clique em "Next":

2.2 - Dê um nome para o seu projeto e entre com um identificador da sua empresa. Desmarque a opção Use Automatic Reference Counting também:

2.3 - Escolha um diretório e salve o seu projeto. O XCode irá abrir o projeto.

3 - Hello World

3.1 - Vamos tentar executar o projeto para ver o que acontece:

3.2 - O seguinte erro deverá aparecer no simulador:

3.3 - Clique com o botão direito no projeto e escolha "Show in Finder":

3.4 - Você irá ver uma pasta chamada "www". Clique e arraste essa pasta para dentro do projeto:

3.5 - Depois que soltar a pasta dentro do diretório, uma janela de configuração irá se abrir: Marque as seguintes opções:

4 - Executando a Aplicação no Emulador iOS

4.1 - Vamos executar o projeto novamente, e este deve ser o resultado:

5 - Próximos Passos

Agora basta estudar a API e soltar a criatividade!

Código Fonte apresentado nesse tutorial: https://github.com/loiane/cordova-ios-helloworld

Update Novembro 2012:

Esse tutorial vale apenas para phonegap 1.x - a versão 2 é totalmente diferente. Em breve um post atualizado aqui no blog.

Até a próxima!