React + nginx refresh occur

Question

guys. I'm running a React page using nginx on Ubuntu. and server connection works fine. But when I try to refresh, I get a 404 error. I know it's a SPA problem. So, I added the following code to nginx.conf's 'location /' section and reloaded nginx.

location / {
      try_files $uri /index.html;
    }

But only white pages are appearing. How can I fix this?

My whole nginx.conf is below here.

worker_processes  1;

events {
    worker_connections  1024;
}

http {
  include       /etc/nginx/mime.types;
  default_type  application/octet-stream;

  upstream front-server {
    server 127.0.0.1:3000;
    keepalive 100;
  }

  upstream backend-server {
    server 127.0.0.1:8080;
    keepalive 100;
  }

  server {
    listen 80;
    server_name localhost;

    location / {
      proxy_pass http://front-server;

      proxy_set_header HOST $host;
      proxy_set_header Referer $http_referer;

      try_files $uri /index.html;
    }

    location /api {
      proxy_pass http://backend-server;

      proxy_set_header HOST $host;
      proxy_set_header Referer $http_referer;
    }

    error_page 500 502 503 504 /50x.html;
    location = 50x.html {
      root /usr/share/nginx/html;
    }
  }
}