Texto de: Letícia Garcez
Introdução
Vercel é uma plataforma para a hospedagem de sites estáticos que possui um processo de deploy de aplicações simples e intuitivo que permite que você hospede seus projetos de forma gratuita. Ao longo deste artigo, veremos como fazer o deploy de um projeto armazenado no GitHub utilizando essa plataforma de uma forma rápida e simples.
Criando a conta
Primeiro de tudo, é preciso que você tenha uma conta no site da Vercel. Para criar a conta, você deve entrar no site e clicar em SignUp, como mostrado na imagem abaixo:
Uma vez clicando em fazer o cadastro, você pode deve selecionar qual tipo de conta você deseja criar. Nesta página, você deve selecionar a opção Hobby (para projetos pessoais) ou Pro (para projetos comerciais). Depois disso, você deve colocar o seu nome na caixa de texto e clicar em continuar.
Agora, você pode optar por continuar o registro adicionando uma conta já existente de serviços como o Gitlab, Bitbucket ou GitHub, ou fazer o cadastro através de um e-mail. Eu recomendo que você utilize a opção de continuar usando o um dos provedores de Git pois sincronizar a sua conta com a Vercel vai permitir que você tenha acesso a todos os projetos armazenados na conta.
Importando repositórios
Uma vez feito o cadastro, você deve acessar a página de overview dos seus projetos que se parece com a imagem abaixo, e então clicar em Add New. Isso fará com que um menu dropdown apareça, e nesse menu você deve selecionar a opção Project.
Depois disso, você pode optar por importar um repositóio do Git ou então fazer o clone de um dos modelos de projetos já existentes. Com a sua conta do GitHub sincronizada você consegue ter acesso a todos os repositórios do seu perfil que serão listados nessa página.
Caso seus projetos não apareçam automaticamente, clique na seta na caixa de pesquisa para selecionar a conta da qual os projetos devem ser importados. Clicando em Switch Git Provider, você pode selecionar outro servidor de repositórios, o que é útil caso você tenha repositórios que gostaria de fazer o deploy em outras plataformas.
Porém, a opção que nos interessa aqui (considerando que estamos usando o GitHub como provedor) é a opção Add GitHub Account. Ao clicar nessa opção, uma janela pop-up vai se abrir e nela você deve selecionar a conta de usuário ou organização de onde os repositórios devem ser importados.
Feito isso, você deve selecionar a quais repositórios a Vercel terá acesso. A opção All repositories dá acesso a todos os repositórios no seu perfil incluindo os repositórios futuros. Já a opção Only select repositories vai fazer com que você tenha de selecionar os repositórios que podem ser acessados pela Vercel.
Depois de selecionar a opção de acesso aos repositórios que mais se adaptar às suas necessidades, clique em Install.
Depois disso, os repositórios vinculados à conta selecionada vão aparecer, e o deploy pode ser feito.
Fazendo o Deploy
Por padrão, os repositórios exibidos são os com alterações recentes, mas utilizando a barra de pesquisa, você pode encontrar qualquer repositório da sua conta. Uma vez que você tenha encontrado o repositório com o projeto que deseja fazer o deploy, basta clicar em Import para iniciar o processo.
Agora só é preciso fazer as configurações do deploy. Você pode configurar o nome do projeto que por padrão é o nome do seu repositório, e selecionar o framework com o qual você está trabalhando na opção Framework Preset. Essa informação é importante para que os comandos de build corretos sejam rodados.
Em Root Directory, você deve selecionar a pasta principal do projeto. Por padrão, essa opção é setada para a pasta raiz do seu repositório e não a uma pasta que esteja dentro desse repositório. Caso a sua pasta principal seja uma pasta chamada frontend que esteja dentro do repositório, é preciso clicar em Edit e modificar o caminho.
Além das configurações básicas, nesta página você também pode selecionar algumas configurações de Build e Output, ou setar algumas variáveis de ambiente, como chaves de uma API por exemplo caso isso seja relevante para a sua aplicação.
Depois disso, basta clicar em Deploy, e esperar o processo terminar. Esse processo pode demorar algum tempo dependendo da complexidade do seu projeto, mas ao final você verá uma tela como a mostrada abaixo, que indica que o Deploy do seu projeto foi feito com sucesso.
Clicando em Go to Dashboard você tem todas as opções de monitoramento do Deploy,e para acessá-lo você pode clicar em Visit ou então em qualquer uma das opções mostradas no item Domains, destacado na imagem abaixo.
É importante ressaltar que agora a URL principal do seu projeto é dada pelo domínio atribuído à ele pela Vercel, então caso você tenha alguma URL que interaja com o localhost localmente por exemplo, essa URL precisa ser atualizada para a URL mostrada no dashborad.
Para acessar o deploy da sua aplicação, basta utilizar qualquer link de domínio. Esse link é público, o que significa que você pode encaminhá-lo para qualquer pessoa que tenha interesse em ver o seu projeto ou algo do tipo.
Para fazer alterações ou updates do seu projeto, basta fazer commits na branch main, o que implicará em um novo processo de build com as novas alterações de forma automática.
Considerações finais
Esse é o processo de deploy de uma aplicação na Vercel. O deploy nesta palataforma é uma ótima maneira de apresentar seus projetos para outras pessoas já que o processo de configuração é simples e o de manutenção é automático sendo feito a cada commit na branch principal.
Bons estudos!