Envie e-mails facilmente pelo seu aplicativo móvel usando Appery.Io e Mailgun

Esta publicação foi escrita por Max Katz, líder de relações de desenvolvimento na Appery.io.

Profissionais de desenvolvimento que usam a plataforma de aplicativos móveis baseada em nuvem, Appery.io, enviam e-mails a partir dos seus aplicativos para cadastro, confirmação e tudo o mais. Para simplificar o uso da API do Mailgun na Appery.io, introduzimos um plug-in do Mailgun na Appery.io.

O plug-in tem um aplicativo de exemplo com uma página que mostra como enviar um e-mail usando a API. Você pode usar o aplicativo de exemplo como ponto de partida ou adicionar o plug-in a qualquer aplicativo existente.

Antes de mostrar como usar o plug-in, quero falar um pouco mais sobre a plataforma de desenvolvimento Appery.io.

Appery.io é uma plataforma de desenvolvimento em nuvem e de tempo de execução que permite criar rapidamente aplicativos móveis corporativos multiplataforma conectados a APIs. Estes são os benefícios e recursos da plataforma:

• Crie rapidamente aplicativos móveis multiplataforma com o Appery.io App Builder visual de arrastar e soltar. Os aplicativos são criados com tecnologias de código aberto, como jQuery Mobile, Ionic, Bootstrap e Apache Cordova
• Conecte-se facilmente a um banco de dados SQL externo e a outras fontes de dados corporativos com o Appery.io API Express
• Envie rapidamente notificações push direcionadas com o Appery.io Push
• Adicione rapidamente um banco de dados ao seu aplicativo com o Appery.io Database
• Escreva rapidamente qualquer lógica no lado do servidor e crie APIs personalizadas com o Appery.io Server Code
• Teste ou compartilhe instantaneamente seus aplicativos com qualquer pessoa em qualquer dispositivo com o aplicativo Appery.io Tester
• Empacote rapidamente o seu aplicativo para iOS, Android e Windows Phone para enviar a uma loja de aplicativos com o Appery.io Cloud Build

Agora que apresentamos a plataforma, a seguir, vamos criar um aplicativo móvel que usa a API do Mailgun para enviar mensagens de e-mail a partir do aplicativo.

O primeiro passo é adicionar um plug-in a um aplicativo novo ou existente. O plug-in está disponível para aplicativos Ionic e jQuery Mobile. Se você tiver familiaridade com o AngularJS, poderá usar a versão do Ionic. Se você ainda não tiver familiaridade com o AngularJS, será melhor experimentar a versão do jQuery Mobile (basta pular uma seção à frente).

1. Dentro do App Builder (você pode usar um aplicativo existente ou criar um novo), selecione Create new > From Plugin
2. Encontre Mailgun Mail API na categoria Communication . Marque a caixa de seleção para o plug-in e clique no botão Import selected plugins .

1. Dentro do App Builder (você pode usar um aplicativo existente ou criar um novo), selecione Create new > From Plugin.
2. Encontre Mailgun Mail API na categoria Communication . Marque a caixa de seleção para o plug-in e clique no botão Import selected plugins .
3. Na página seguinte, marque a caixa de seleção para abrir o arquivo de configurações. Além disso, defina a página inicial como Mailgun. Em seguida, clique no botão Apply settings . O plug-in será adicionado ao seu aplicativo. Pronto. O plug-in foi adicionado ao seu aplicativo.

Agora que o plug-in está disponível no aplicativo, há algumas configurações mínimas que você precisa fazer. Há três partes nesta seção:

1. Configuração do domínio do Mailgun
2. Proteção das credenciais da API do Mailgun
3. Configuração de um proxy seguro

O domínio do Mailgun identifica a sua conta.

1. Se você não tem uma conta do Mailgun, se cadastra!
2. Abra as configurações do seu domínio e copie o valor do domínio — que é tudo antes de .mailgun.org
3. Cole o valor para a propriedade domain no arquivo Services/Mailgun_settings .

A API do Mailgun usa Basic Authentication para autenticação. Como você quer garantir que as informações de autenticação não sejam expostas no cliente, elas devem ser mantidas seguras no servidor.

1. Dentro do App Builder, clique em Database (barra de ferramentas, canto superior direito).
2. Clique em Create new database. Chame o banco de dados de mailgunDB.
3. Clique em Create new collection. Chame a coleção de secret.
4. Dentro da coleção secret, crie duas colunas clicando no link +Col . Ambas as colunas conterão strings.
   1. keyName (tipo de string)
   2. keyValue (tipo de string)
5. Clique em +Row para adicionar dados à coleção.
6. Na coluna keyName, insira mailgunAuthProxy.
7. Como o Mailgun usa Basic Authentication, você precisa codificar o nome de usuário e a senha. A maneira mais simples de fazer isso é abrir o Chrome Dev. Guia Console do Tools, insira o seguinte e pressione Enter (você encontrará a chave de API no painel do domínio: >window.btoa("api:key-0ce1xxxxxx");
8. O valor codificado será exibido na linha seguinte:
 >"YXBpOmtleS0wYxxxx"
9. Copie todo o valor (incluindo o que está no final). Volte à coleção do banco de dados, para o valor de mailgunAuthProxy insira “Basic ” (com espaço) e cole todo o valor em seguida.


Agora as credenciais da API do Mailgun estão seguras no servidor. A seguir, você configurará o proxy para usar esse valor.

A configuração do proxy é muito rápida:

1. Abra a página Proxy.
2. Clique em Create new proxy. Nomeie o proxy como MailgunProxy.
3. Selecione Use proxy + store sensitive data option.
   1. Para Database, selecione mailgunDB
   2. Para Collection, selecione secret
   3. Para Key column, selecione keyName
   4. Para Value column, selecione keyValue
4. Clique em Save.
5. Volte ao aplicativo no App Builder. Abra o serviço Mailgun sending. Na guia Settings, atualize a lista de proxies e selecione Mailgun_Proxy.

Se estiver criando um aplicativo Ionic, há mais um passo que você precisa concluir:

• Abra Pages/mailgun, e mude para a guia Scope.
• Para a variável de escopo de e-mail, altere o seu tipo para Email (isto é um bug e será corrigido em breve).

Você também pode abrir de modo opcional Pages/index e definir o texto do Header como API do Mailgun e definir sua Color como positive.

Agora você está com tudo pronto para executar o aplicativo.

Existem duas formas de executar e testar o seu aplicativo. Você pode executar o aplicativo no navegador ou diretamente no dispositivo. Eu também mostrarei como compartilhar o aplicativo com qualquer pessoa.

Teste rapidamente o aplicativo no navegador clicando no botão Test dentro do App Builder. Veja como o aplicativo fica quando executado no navegador:

Também é muito fácil testar o aplicativo em um dispositivo real. Você nem sequer precisa instalar o aplicativo. Basta instalar o aplicativo Appery.io Tester  no seu dispositivo iOS ou Android  e iniciar o aplicativo rapidamente. Ao fazer login no aplicativo Tester, você verá todos os aplicativos que criou e poderá iniciá-los rapidamente. Ao executar o aplicativo pelo aplicativo Tester, você também poderá testar rapidamente qualquer API nativa.

Também é fácil compartilhar o mesmo aplicativo com a sua clientela, colegas e amizades. Tudo o que precisam fazer é instalar o aplicativo Appery.io Tester. Forneça um código de compartilhamento especial e essas pessoas poderão executar o seu aplicativo.

Quer criar aplicativos rapidamente? Comece a Comece a desenvolver com o plano de avaliação gratuita do Appery.io.

Autor: The Sinch Mailgun team The Sinch Mailgun team shares news, best practices, and strategies to take your products and apps to the next level using email. Subscribe to our newsletter to get all the articles in your inbox!