Hospedagem node.js e React

Estou com um problema para hospedar um site com react e node, como organizar os arquivos para subir o site?
Eu fiz da seguinte forma :
Subi o frontend na pasta raiz e o node em uma pasta api_rest, mas ele não busca minhas requisições, lembrando que já configurei o banco de dados, outra dúvida é:
Estou usando axios no react, passo a url com o nome do site ou localhost:3000 ?

Boa tarde, @LoWEz3r4_Gamer

Primeiramente, seja bem-vindo a nossa comunidade :vulcan_salute:

Então, no caso respondendo já sua segunda pergunta, toda aplicação NodeJS aqui na Umbler deve se conectar na porta 3000, independente de ser frontend ou backend.

Sendo assim, isso já influência na resposta da primeira pergunta, você já deve observar que tem um problema pois o seu backend consequentemente vai precisar conectar na mesma porta que o seu frontend e ai vai dar problema :confused:

Mas você tem alguma alternativas para solução, como por exemplo: Reunir o Backend e o Frontend em apenas uma aplicação conectando todos em uma porta apenas.

Outra seria hospedar em aplicações distintas o backend e frontend e conectá-los na porta 3000, a padrão nossa de aplicações NodeJS. Assim o front e o back vão se comunicar mas em containers separados, cada um com uma instância da aplicação através de subdomínio, por exemplo, em que o frontend é o domínio principal e o back é o domínio secundário.

Dito isso, sobre sua aplicação NodeJS não atender sua requisições pode ser algum erro no package.json ou algum erro no momento do deploy, então recomendo verificar esse artigo que cobre essas e outras possibilidades e vai lhe ajudar na localização e na revisão de todos os passos de deploy de NodeJS aqui na Umbler para resolução do seu problema

Depois de feito alguns testes e ainda não solucionado o problema, pode deixar o log do problema aqui que lhe ajudarei :wink:

Olá Mário,

No caso eu preciso ter dois domínios?

Desculpe, sou novo nessa área e nunca subi uma aplicação que não fosse estática, você poderia me enviar um passo a passo de como eu precisaria fazer?

Sobre as portas ok, consigo alterar sem problemas

Boa tarde, César!

Então, reiterando que uma aplicação apenas pode escutar a porta 3000 aqui na Umbler.

Sobre o passo a passo não temos ainda, então vou te passar minhas sugestões que sei que funcionam :wink:

Tem dois jeitos de fazer isso, você pode juntar o seu frontend em React e o backend em node na aplicação, mesma hospedagem e assim conectar tudo na porta 3000, ambos frontend e backend.

Ou outro jeito, mais organizada, é você separar o seu frontend do seu backend em duas aplicações distintas e conectar cada uma na porta 3000. Ai sim, poderia deixar o backend ou frontend, o que achar melhor como um subdomínio de sua aplicação. Por exemplo, o frontend poderia ser o domínio principal e o backend poderia ser o subdomínio desse principal com o conteúdo necessário. Exemplo:

site.com Front-End
app.site.com Back-End

Qualquer dúvida, fico a disposição!

Entendi Mário, o problema é que o cliente não vai pagar dois domínios, kkkk

Você só poderia me explicar um pouco como eu juntaria os dois?

Posso fazer uma build tanto do node como do react e colocar o react na pasta public?

Tentei colocar o React na pasta raiz e uma pasta chamada “api_rest”, não deu certo, talvez por causa da porta, vou testar aqui, mas se puder me ajudar eu agradeço, desde já obrigado

Mário, tenho um domínio adquirido direto aqui pela umbler, como posso criar um subdominio para subir meu backend no mesmo?

Bom dia, @LoWEz3r4_Gamer!

Peço perdão pela demora em lhe dar uma resposta, meu amigo, às vezes são tantas perguntas aqui que acabo passando em branco por algumas :sweat_smile:

Então, verifiquei que seu cliente não pagaria pelos dois domínios. A opção seria “juntar” a parte backend e frontend da aplicação de forma que ambas escutem na mesma porta (3000 para aplicações NodeJS) e que responda corretamente para as rotas de backend e frontend.

No caso de ter mais um domínio e quiser criar uma outra hospedagem para separar em duas hospedagens distintas, o backend em uma e o frontend em outra, ai pode apenas fazer as duas ouvirem da porta 3000, pois estarão em hospedagens diferentes.

Só lembrando que se optar pela segunda opção, utilizando o subdomínio como api para o backend ai o subdomínio funciona como outro domínio para o painel da Umbler, o preço de pagamento dele será adicionado no total que paga na sua conta atualmente. Mas funciona perfeitamente, ambas opções já foram utilizadas.

Ainda não temos um artigo sobre como fazer essa hospedagem “mista” no nosso Help mas verei se é possível fazermos isso para tirar qualquer dúvida que possa a ocorrer no processo. Qualquer novidade eu lhe notificarei :wink:

Como ajuda, já que está utilizando o React recomendo nosso artigo que já existe e vai lhe ajudar a como setar as rotas do React na sua aplicação, se decidir juntar ela com o backend ou manter separada, que você pareceu ter alguns problemas ali pelo que disse. https://help.umbler.com/hc/pt-br/articles/360032787691-Frameworks-JS-na-Umbler

Qualquer problema fico a disposição!