Artigo original: Heroku Deploy – How to Push a Web App or Site to Production

Quando se trata de fazer o deploy (em português, implantação) de uma aplicação, geralmente existem duas opções: um VPS (servidor virtual privado) ou um PaaS (plataforma como serviço). Este artigo mostrará a você uma receita de como publicar uma aplicação em produção em um PaaS como o Heroku.

Nota da tradução: ao final de 2022, o Heroku encerrou o tier gratuito para implantação. Os planos mensais básicos por lá, no momento desta tradução, custam 5 dólares ao mês.

Passo 1 - criar o projeto


O primeiro passo é criar uma estrutura simples para o nosso projeto com alguns arquivos básicos. Para este artigo, vou criar um servidor de demonstração com NodeJS.

Em uma nova pasta, vou abrir um terminal e executar o comando npm init -y para criar um projeto. O servidor fictício será desenvolvido em Express. Assim, precisamos executar o comando npm install express para instalar esse módulo.

Assim que essa biblioteca estiver instalada, podemos criar um arquivo para o nosso projeto, chamado app.js. Dentro dele, escreveremos o código para o nosso servidor simples:

server
Versão RAW do projeto

Podemos iniciar a aplicação executando node app.js. Em seguida, podemos testá-la no seguinte URL http://localhost:3000. Neste ponto, você deve ver a mensagem Hello World no navegador.

output

Passo 2 - sistema de controle de versão

O próximo passo é escolher um sistema de controle de versão e colocar nosso código em uma plataforma de desenvolvimento em um repositório.

O sistema de controle de versão mais popular é o Git, juntamente com o Github como plataforma de desenvolvimento. É isso que usaremos aqui.

No GitHub, crie um repositório para sua aplicação, como mostrado abaixo:

1

Para enviar o seu código local para um repositório, você precisa executar os comandos listados no GitHub após clicar no botão Create repository:

git
Comandos para enviar nosso código para o repositório do Github

Importante: antes de fazer isso, precisamos ignorar alguns arquivos. Queremos enviar para o repositório apenas o código que escrevemos, sem as dependências (os módulos instalados).

Para isso, precisamos criar um arquivo .gitignore e, dentro dele, escrever o nome dos arquivos que queremos ignorar.

ignore
Estrutura de pastas e arquivo .gitignore

Agora, podemos escrever os comandos listados na imagem acima (aquela do GitHub).

Se você executou os comandos corretamente, eles estarão na página do seu repositório. Se você atualizar a página, deverá ver seus arquivos, exceto aqueles que você ignorou explicitamente, ou seja, os do diretório node_modules.

git-master

Passo 3 - vincular o repositório ao Heroku


Neste passo, podemos vincular o repositório do GitHub à nossa aplicação no Heroku.

Primeiro, crie uma aplicação no Heroku e siga os passos listados na plataforma.

heroku-new

Assim que a aplicação for criada, uma janela semelhante a esta deve aparecer:

heroku-shoud-see
Painel da aplicação

Agora, se você olhar para a navegação na parte superior, verá Overview, Resources, Deploy, Metrics e assim por diante. Certifique-se que Deploy esteja selecionado. Em seguida, na segunda linha, clique no ícone do GitHub.

search-and-cionnect
Clique para conectar

Procure pela aplicação desejada, que, no nosso caso, é demo-deploy-app-09 . Em seguida, clique em Connect.

deploy
Branch da implantação (deploy)

Uma vez que a aplicação esteja conectada com sucesso à sua conta do Heroku, você pode clicar em Deploy Branch para implantar a sua aplicação.


Se desejar, você também pode selecionar a opção Enable Automatic Deploys, que buscará automaticamente o código do seu repositório do GitHub sempre que você fizer um push para esse repositório.


Assim que a aplicação for implantada, você pode clicar em View para abrir a sua aplicação.

final

Passo 4 - configurar o Heroku para executar corretamente a aplicação


Se você abrir a aplicação nesse momento, deverá ver algo parecido com isso:

errr

Isso mesmo: um erro. Isso ocorre porque o Heroku não sabe como iniciar nossa aplicação.

Se você se lembra, executamos o comando node app.js para iniciar a aplicação localmente. O Heroku não tem como saber quais comandos precisa executar para iniciar a aplicação. É por isso que ele gerou um erro.

Para resolver esse problema, precisamos criar um arquivo chamado Procfile com o seguinte conteúdo: web: node ./app.js.

Para atualizar nossa aplicação, tudo o que precisamos fazer é enviar um novo commit para o GitHub. Se tivermos ativado a opção de Automatic Deploys, o código será automaticamente puxado para o Heroku. Caso contrário, precisamos clicar novamente Deploy Branch.

Assim que a aplicação for reconstruída, deveríamos vê-la funcionando assim:

deployed

Passo 5 - como adicionar um complemento


Um dos principais benefícios que o Heroku oferece é a facilidade de adicionar recursos na forma de complementos (add-ons) ao seu projeto. Esses recursos externos podem ser bancos de dados, ferramentas de registro e monitoramento, ferramentas de Integração e Entrega Contínua (CI/CD) ou ferramentas de teste.

Agora vamos ver como adicionar um novo recurso ao seu projeto. Primeiro, acessamos Resources (em português, recursos) e, a partir daí, adicionaremos uma nova ferramenta para testes.

add-addon

Clique em Find more add-ons e, depois, procure por Loadmill.

O Loadmill é uma ferramenta de teste que é realmente ótima para testes de regressão e testes de carga.

install-loadmill

Clique em Install…. Em seguida, escolha a aplicação que deseja vincular.

provision-add-on

Neste passo, o Heroku criará automaticamente uma conta para você na plataforma fornecida.

Na guia de recursos, você pode ver o recurso que foi adicionado há pouco:

ff

Se você acessar esse complemento, deverá ver o painel de controle com um tutorial de introdução e um teste de demonstração criado para você.

fff2
Painel do Loadmill

Conclusão

O Heroku permite que os desenvolvedores implantem rapidamente e quase sem esforço uma aplicação em um servidor web.

Ele também oferece uma variedade de plug-ins que você pode integrar à sua aplicação.

Uma solução PaaS sempre permitirá que você avance mais rapidamente do que uma solução com um VPS, onde você precisa configurar tudo desde o início.