Como enviar uma aplicação ReactJS para minha conta no Plesk

Para poder ver, a partir do seu domínio, uma página web feita em ReactJS siga estes passos:

Adicione o Homepage ao seu arquivo package.json

Abra sua aplicação React. Depois, abra o arquivo package.json e adicione um atributo “homepage” da seguinte maneira:

O formato deve ser "homepage": "https://meudominio.com"

Crie o build da sua aplicação

No diretório raiz da sua aplicação, execute o comando yarn install para instalar as dependências atualizadas.
Quando isso terminar, execute o comando yarn build (npm install e npm build também funcionam).
Você notará que isso cria um novo diretório no seu projeto chamado build. O diretório build é, basicamente, uma versão comprimida do seu programa que contém tudo o que o navegador precisa para identificar e executar sua aplicação.

Envie o conteúdo do diretório build para o diretório principal do site, na conta de hospedagem.

O passo seguinte é enviar o conteúdo do diretório build, que você criou no passo anterior, para o diretório principal do seu site. Usando o Gerenciador de Arquivos do painel de controle, ou entrando via FTP.\ \ No caso de uma conta cPanel, o diretório seria public_html.

No caso de uma conta Plesk, o diretório seria httpdocs.

Este é um exemplo da estrutura de diretórios de uma conta no cPanel, onde você verá o diretório public_html.

E este é um exemplo da estrutura de diretórios de uma conta no Plesk, onde você verá o diretório httpdocs.

Este é um exemplo dos arquivos típicos que você verá no seu diretório build, que deverá enviar para o public_html, httpdocs ou o diretório principal da sua página web.

Crie o arquivo .htaccess

Para que as rotas funcionem na sua aplicação React, você precisará adicionar um arquivo .htaccess.
Deve criar este arquivo na pasta public_html, httpdocs ou no diretório principal da sua página web, no mesmo nível que o conteúdo do diretório build que enviou anteriormente.
\ Edite o arquivo e insira a seguinte informação básica:

text

<IfModule mod_rewrite.c>

  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]

</IfModule>

Depois, salve as alterações no arquivo.

É isso!

Agora você poderá usar seu domínio no navegador e deverá ver sua aplicação web totalmente funcional.