Deploy ReactJS no CPANEL

Antes de de começar, estou considerendo que você já saiba o que é uma chave SSH e como utilizar o versionamento de código com Git e GitHub. Também é necessário ter uma conta CPANEL já disponível para realizar a instalação e uma conta no GitHub com um repositório disponível.

Adicionando o controle de versão

Primeiramente é necessário criar o controle de versionamento de código para adicionar o repositório ao cpanel, para realizar isso basta navegar na página inicial da hospedagem e acessar o controler de versionamento.

Após acessar, clique em criar!

Nesta aba é onde será configurado o repositório. Para então adicionar o repositório tem que adicionar uma chave SSH para o CPANEL conseguir se comunicar com o GitHub, em caso de um repositório privado, caso seja um projeto open-source poderá pular a etapa de configuração da chave SSH.

Adicionando uma chave SSH

Para adicionar uma chave SSH, clique em SSH Access dentro da página representada anteriormente. Agora nesta nova aba, clique em Manage SSH Keys.

Depois de realizar essas operações então em Generate a New key para gerar uma nova chave SSH, essa chave será adicionada porteriormente dentro do GitHub.

Com a nova aba aberta, preencha as informações e prossiga clicando em Generate Key.

Depois disso, a chave será criada então volte para a lista de chaves clicando em Go back.

Agora é necessário liberar a chave para uso. Na página inicial do gerênciamento de chave clique em Manage.

E, então clique em Authorize para liberar a sua chave para uso. Feito isso clique em Go Back.

Na página incial do gerenciamento de chaves há 2 chaves que foram geradas. Clique para visualizar a chave pública em View/Download.

Agora tem a sua chave autorizada, copie ela!

Neste passo, então, abra uma nova aba e acesse a sua conta no GitHub e acesse o seu perfil. No menu lateral clique na opção SSH and GPG Keys. Apos fazer isso clique em New SSH Key.

Adicione um título e cole a chave SSH pública que foi copiada nos passos anteriores. Feito isso, clique em Add SSH key.

Agora foi adicionado a chave SSH ao seu GitHub e o CPANEL poderá ter acesso ao seu repositório privado ou público.

Finalizando a configuração do repositório

Se o seu repositório for privado, é importante que antes de começar está etapa você tenha configurado corretamente a chave SSH, conforme demonstrado na etapa anterior*.*

Para começar vá até o repositório que deseja adicionar ao CPANEL copie o link de cópia dele.

Cole o link do seu repositório no campo Clone URL. Logo após, clique em create para criar o versionamento de código do seu repositório.

Configuração do repositório finalizada com sucesso no CPANEL, agora clique em Manage para gerenciar o seu repositório adicionado.

Nesta página poderá realizar algumas configurações, como por exemplo definir qual branch será a padrão do projeto. Neste caso está a branch main como padrão. Mantenha o que está e clique em Pull or Deploy.

Nesta aba é a que será utilizada para realizar o pull e deploy da aplicação.

Entretanto antes de clicar para realizar o pull e deploy da sua aplicação é necessário realizar algumas configurações no seu repositório. Crie um arquivo chamado .cpanel.yml e adicione o seguinte conteúdo:

deployment:
  tasks:
    - export DEPLOYPATH=/home/hsesafetycom/public_html/
    - rm -rf $DEPLOYPATH
    - /bin/cp -R build/. $DEPLOYPATH

Neste conteúdo estamos dizendo que vamos deletar e copiar todos os arquivos de dentro pasta build para a pasta public_html. Para que isso seja obedecido é necessário remover do .gitignore a pasta build.

Agora compile o seu projeto rodando npm run build e então efetue o push para a sua branch remota. Sua branch de deploy terá que conter a pasta build pois ela será movida para a public no momento do deploy.

Se o seu repositório estiver assim na branch de deploy você pode voltar para o Cpanel baixar as atualizações e clicar em deploy.

Recarregue a página e clique Deploy HEAD Commit feito isso seu deploy já está pronto. Agora toda alteração dentro da sua branch main você terá que entrar no CPANEL, baixar as atualizações e realizar o deploy! Para confirmar se está certo você poderá acessar o file manager e clicar em public_html feito isso seus arquivos da pasta build vão estar lá!

OBS: Infelizmente não consegui deixar isso automatizado e essa foi a melhor forma para fugitr do FTP.