{"id":19954,"date":"2020-02-12T10:48:54","date_gmt":"2020-02-12T12:48:54","guid":{"rendered":"https:\/\/king.host\/wiki\/?post_type=article&p=19954"},"modified":"2025-06-11T11:56:36","modified_gmt":"2025-06-11T14:56:36","slug":"como-fazer-deploy-aplicacao-react","status":"publish","type":"article","link":"https:\/\/king.host\/wiki\/artigo\/como-fazer-deploy-aplicacao-react\/","title":{"rendered":"Como fazer deploy de uma aplica\u00e7\u00e3o React"},"content":{"rendered":"\n

Aprenda como realizar o deploy de sua aplica\u00e7\u00e3o React de uma maneira f\u00e1cil e simples, atrav\u00e9s desse artigo<\/em>.<\/p>\n\n\n\n

React \u00e9 uma biblioteca do JavaScript para cria\u00e7\u00e3o de interfaces, Sendo atualmente a biblioteca mais popular do JavaScript. <\/p>\n\n\n\n

Ent\u00e3o nesse artigo vamos ver que realizar o deploy de sua aplica\u00e7\u00e3o React pode ser muito simples.<\/p>\n\n\n\n

\"banner-kinghost\"<\/a><\/figure>\n\n\n\n

<\/span>Preparando os arquivos para Deploy<\/span><\/h3>\n\n\n\n

Nesse tutorial, para exemplificar, vamos fazer o deploy da aplica\u00e7\u00e3o padr\u00e3o de quando iniciamos um projeto no React.<\/p>\n\n\n\n

Primeiramente vamos ir at\u00e9 a pasta onde se encontra nossa aplica\u00e7\u00e3o e rodar o seguinte comando:<\/p>\n\n\n\n

npm run build<\/pre>\n\n\n\nEste comando deve ser executado em ambiente de desenvolvimento<\/strong>!!<\/alerta>\n\n\n\n
Esse comando ir\u00e1 gerar uma vers\u00e3o otimizada e pronta para deploy em qualquer ambiente. Quando rodar o comando, pode demorar uns minutos dependendo do tamanho da aplica\u00e7\u00e3o para que seja conclu\u00eddo. Ap\u00f3s isso a aplica\u00e7\u00e3o se encontrar\u00e1 dentro da pasta build<\/strong>.<\/p>\n\n\n\n
\"Como<\/figure>\n\n\n\n
<\/span>Deploy do React<\/span><\/h3>\n\n\n\n
Ap\u00f3s termos os arquivos prontos para deploy, \u00e9 necess\u00e1rio passar os mesmos para o FTP do seu dom\u00ednio na pasta onde voc\u00ea vai querer fazer o deploy. <\/p>\n\n\n\n
Caso tenha alguma d\u00favida de como fazer o acesso ao FTP, pode seguir esse tutorial<\/a>. Esse deploy tamb\u00e9m pode ser feito via GIT, para isso acesse esse post<\/a>.<\/p>\n\n\n\n
\"Exibindo<\/figure>\n\n\n\n
Nesse caso o caminho da aplica\u00e7\u00e3o ficou na raiz do nosso dom\u00ednio na www<\/strong>. Acessando em seu navegador https:\/\/seudominio.com.br<\/strong>  aparecer\u00e1 sua aplica\u00e7\u00e3o.<\/p>\n\n\n\n
<\/span>Deploy em subpasta<\/span><\/h3>\n\n\n\n
Caso voc\u00ea queira utilizar o React em uma subpasta, \u00e9 necess\u00e1rio informar a URL antes de “buildar<\/em>” a vers\u00e3o de produ\u00e7\u00e3o.<\/p>\n\n\n\n
Para fazer isso \u00e9 necess\u00e1rio alterar o arquivo package.json<\/strong> e adicionar essa linha:<\/p>\n\n\n\n
 \"homepage\" : \"http:\/\/seusite.com.br\/pasta-da-aplica\u00e7\u00e3o\/\" <\/pre>\n\n\n\n
\"Editando<\/figure>\n\n\n\n
Ap\u00f3s isso \u00e9 necess\u00e1rio rodar o npm run build<\/strong> e os arquivos ser\u00e3o gerados novamente.<\/p>\n\n\n\n
Agora \u00e9 s\u00f3 colocar eles no seu FTP dentro da pasta onde ficar\u00e1 sua aplica\u00e7\u00e3o. Ent\u00e3o voc\u00ea ter\u00e1 o retorno de sua aplica\u00e7\u00e3o, no nosso caso essa p\u00e1gina inicial.<\/p>\n\n\n\n
\"P\u00e1gina<\/figure>\n\n\n\n
O React \u00e9 poss\u00edvel de ser utilizado em todos nossos planos de hospedagem,  voc\u00ea pode verificar os nossos planos clicando aqui<\/a>.<\/p>\n","protected":false},"author":9,"featured_media":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","article-category":[181,172],"article-tag":[],"class_list":["post-19954","article","type-article","status-publish","format-standard","hentry","article-category-javascript","article-category-linguagens-web"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t