Fazendo um deploy simples e rápido de aplicações React

Há algum tempo atrás, enquanto estudava sobre como fazer deploy de um app React de maneira simples e rápida no Heroku, acabei me deparando com uma ferramenta magnífica que simplificava totalmente esse processo, apesar de já ter ouvido falar nela, nunca tinha parado para ver em que realmente ela poderia me ajudar.

Eu estou falando do Netlify, uma plataforma totalmente automatizada, ela é simplesmente perfeita para criar uma infraestrutura de sites e web-apps de forma prática e rápida e o melhor tudo é que ela tem um plano gratuito ótimo para testarmos projetos pessoais e que ainda nos fornece fácil integração com os principais repositórios de código.

Nesse artigo, eu irei demostrar como fazer um deploy de um web-app em React criado a partir do Create React App.

Vamos lá?

Partindo pra action

Antes de mais nada, precisamos criar um projeto React. Para fazer isso, podemos utilizar o seguinte comando:

npx create-react-app deploy-netlify

Isso irá criar um app em React totalmente configurado no diretório deploy-netlify a partir do diretório que você executou o comando acima. Feito esse passo, acesse o diretório deploy-netlify e execute o comando yarn start ou npm start caso não tenha o Yarn instalado em seu computador e se tudo estiver certo, será possível visualizar o projeto rodando em http://localhost:3000/.

Para realizar o processo de deploy contínuo do nosso projeto, iremos criar um repositório no Github.

Após isso, vamos subir nosso código para o repositório criado.

git remote add origin git@github.com:seu-usuario/deploy-netlify.git
git push -u origin master

Feito isso, vamos integrar nosso repositório com o Netlify, para isso realize o login na plataforma utilizando sua conta do Github e depois clique no botão New site from Git.

Selecione o Github como sendo seu provedor Git e dê todas permissões, caso necessário. Logo após, escolha o repositório que criamos anteriormente para permitir o deploy contínuo do mesmo e clique sobre nome do repositório que será apresentado, assim como demonstrado na imagem abaixo:

Agora clique no botão Deploy Site e aguarde o processo terminar. Em seguida, clique no link, que é gerado automaticamente pela plataforma, e parta para o abraço.

Como podem ver é bem simples fazer deploy do seu app utilizando o Netlify, além do mais, a partir do momento que você tem o seu repositório integrado sempre que forem feitos novos commits na branch configurada, eles automaticamente serão aplicados em produção.

Cleber Carvalho

Github LinkedIn