Criando App em 3 minutos

 

No artigo de hoje, criaremos um APK para android rapidamente utilizando HTML, CSS e JavaScript.

Vamos Começar!

Primeiramente, criaremos um novo projeto em branco. Neste projeto, você deve criar um arquivo HTML. O nosso será index.html e terá esta estrutura:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>App em 4 Minutos</title>
</head>
<body>
    
</body>
</html>

Podemos inserir um h1:

<h1>Olá Mundo</h1>

E também um botão:

<button>Clique aqui</button>

Após isso, adicionaremos um script JavaScript na página. Esse script adicionará uma função ao ser clicado o button, que irá disparar um alert.

document.querySelector("button").addEventListener("click", () =>{
    alert("Olá MundoJS!!!!!");
})

Na tag head, inserimos um css:

h1{
    font-size: 20px;
}

button{
    width: 100%;
    padding-top: 5px;
    padding-bottom: 10px;
}

Próximo passo:

Acessando o site http://build.phonegap.com, crie o seu login e acesse. Existem duas opções: open-source, onde você pode deixar seu app e códigos abertos para a comunidade, e a opção privada. Você pode utilizar o Pull do seu repositório GitHub e também pode adicionar um arquivo .zip com seus códigos.

Faremos o upload do nosso arquivo .zip. Feito o upload, adicionamos apenas uma descrição simples do aplicativo criado. Com esses poucos passos, criamos um arquivo .apk para android!

Depois disso, é só baixar o seu aplicativo clicando no botão Source! Você também pode acessá-lo diretamente do seu celular, utilizando o mesmo link da URL!

Baixando do celular, será necessário instalar o aplicativo .apk e realizar as permissões necessárias.

Confira as imagens:

E o APP criado:

O Adobe PhoneGap Build é um cloud service para compilar aplicativos PhoneGap. Ele fornece uma maneira dos usuários criarem aplicativos móveis utilizando HTML, CSS e JavaScript. Os aplicativos podem ser distribuídos em várias lojas de aplicativos, como Play Store, Apple iOS App Store, entre outros; E instalados no dispositivo do usuário final como qualquer outro aplicativo nativo. Ele oferece:

  • Compilação e assinatura gerenciadas (sem SDKs);
  • Várias plataformas suportadas;
  • Ciclo de desenvolvimento mais rápido;

Você pode ler toda a documentação do Adobe PhoneGap em: docs.phonegap.com/

Gostou deste Artigo? Deixe seu comentário abaixo!