2
respostas

Ajuda - FrontEnd não funciona!!

Estou com um problema chato na aplicação adopet na parte de frontend, eu executei o build e apareceu algumas mensagens de alerta de depreciação porém conseguiu concluir com exito:

docker-compose build

npm warn deprecated superagent@8.1.2: Please upgrade to v9.0.0+ as we have fixed a public vulnerability with formidable dependency. Note that v9.0.0+ requires Node.js v14.18.0+. See https://github.com/ladjs/superagent/pull/1800 for insight. This project is supported and maintained by the team at Forward Email @ https://forwardemail.net
npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
npm warn deprecated npmlog@5.0.1: This package is no longer supported.
npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported
npm warn deprecated gauge@3.0.2: This package is no longer supported.
npm warn deprecated are-we-there-yet@2.0.0: This package is no longer supported.
npm warn deprecated @humanwhocodes/object-schema@2.0.3: Use @eslint/object-schema instead
npm warn deprecated @humanwhocodes/config-array@0.11.14: Use @eslint/config-array instead

added 780 packages, and audited 781 packages in 18s

118 packages are looking for funding
  run `npm fund` for details

6 vulnerabilities (5 moderate, 1 critical)

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
npm notice
npm notice New patch version of npm available! 10.8.1 -> 10.8.2
npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.8.2
npm notice To update run: npm install -g npm@10.8.2
npm notice
Removing intermediate container 7ffc95acae2d
 ---> a8b7e4a30c63
Step 6/8 : COPY . .
 ---> 8eb9b548b535
Step 7/8 : RUN npm run build
 ---> Running in 439cb2e01d5d

Quando vou rodar o docker-compose up aparece normalmente os logs sem nenhuma mensagem de erro:

adopet-backend | [Nest] 55  - 08/01/2024, 6:35:41 AM     LOG [RouterExplorer] Mapped {/adotante/login, POST} route +1ms
adopet-backend | [Nest] 55  - 08/01/2024, 6:35:41 AM     LOG [RoutesResolver] MessageController {/mensagem}: +0ms
adopet-backend | [Nest] 55  - 08/01/2024, 6:35:41 AM     LOG [RouterExplorer] Mapped {/mensagem, POST} route +0ms
adopet-backend | [Nest] 55  - 08/01/2024, 6:35:41 AM     LOG [RouterExplorer] Mapped {/mensagem/:id, GET} route +0ms
adopet-backend | [Nest] 55  - 08/01/2024, 6:35:41 AM     LOG [NestApplication] Nest application successfully started +1ms

Porém quando vou executar o localhost para abrir o frontend aparece essa mensagem:

{
"statusCode": 404,
"message": "Cannot GET /",
"error": "Not Found"
}

A impressão é que a aplicação não está buildando, pois fiz um teste direto com o dockerhub no docker-compose.yaml >>

image: gabiribeiro/adopet-frontend:latest

E carregou normalmente o frontend.

Poderiam me ajudar?

Estou utilizando ubuntu: 24.04
NPM: 10.8.2
NodeJs: 20.11.1
2 respostas

Boa tarde amigo.

Estava nessa situação e no meu caso eu estava colocando somente: http://localhost:3000.

No entanto a rota explicada do curso é: http://localhost:3000/adotante

Tenta pra ver se consegue, no meu caso funcionou.

Opa Eweton, obrigado por tentar ajudar, mas esse http://localhost:3000/adotante seria o backend da aplicação, o frontend é aquela parte que ela mostra em torno de 4 minutos no vídeo, onde ela acessa apenas o http://localhost e acessa a pagina principal da aplicação essa parte não funciona. Mandei no anexo o print da imagem que estou comentando. E onde não funciona pra mim quando tento acessar. Porém se utilizo a imagem dela funciona normalmente o problema está no meu build pq muitas das dependências não estão funcionando.

Insira aqui a descrição dessa imagem para ajudar na acessibilidade