React app not rendering data from Web Service

1

I successfully deployed the backend of my application on Web Service and the React frontend with Static Sites. However I’m coming across several problems:

  1. Logo header image is the wrong size and doesn’t reflect most recent CSS styling.
  2. When I go to /login or /register or any slug I enter into the URL manually, it returns “Not Found”
  3. Home page does not return any API data from the Node server.

Here is my website: https://selfcarecoder.onrender.com/

Any help would be appreciated, please! There are no errors in the console or anywhere to guide me at this point.

2

Hi,

These don’t all sound like Render issues, but I’ll try and help with your queries:

  1. You’ll need to check your CSS is being generated/served as you expect. There are various methods for implementing styling nowadays, CSS modules, built files, pre-processors, etc. Maybe the browser console/inspector will help you pinpoint stylesheet issues.

  2. That sounds like you’re using client-side routing (e…g React Router), you’ll need to setup a rewrite rule on a Static Site for that to work, covered in our React deploy guide: https://docs.render.com/deploy-create-react-app#using-client-side-routing

  3. Again, maybe check the browser console/network tab to make sure your frontend it making the API calls you expect and if they’re successful. If you’re using a Web Service with a free instance type, it will spin-down with inactivity and spin back up on the next request, which can take a little time, which could make it appear as nothing loaded until it boots. More on that in the docs: https://docs.render.com/free#spinning-down-on-idle

Alan

1 Like
3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.