How to configure cross-domain access to back-end restful api? with nginx in react front end

the development machine is a centos virtual machine installed in windows,windows as a restful api server, and the api server can be accessed normally in the browser:

http://192.168.33.3:8080/articles

// 20181229004601
// http://192.168.33.3:8080/articles

{
  "code": 0,
  "message": "OK",
  "data": {
    "article_list": [
      {
        "id": 15,
         "title": "hello15",
        "content": "hello world15",
        
      },
      //...
      ]
}

the front end uses react-create-app scaffolding to access loacalhost:3000, normally. In react, you can use axios to access the back-end api server. Cross-domain settings are needed. Two ways have been tried:

Type 1: add the following code to package.json in react-create-app

"proxy": "http://192.168.33.3:8080"

the following error occurs in the chrome console in this way:

GET http://192.168.33.3/articles?limit=10&offset=5 net::ERR_CONNECTION_REFUSED

Type 2: use nginx reverse proxy
1, install nginx, on windows and use localhost:80 to access it normally, add a reverse proxy server in the conf/nginx.conf file, and start nginx:

//D:\workspace\nginx\conf\nginx.conf
    server {
        listen       3000;
        server_name  localhost;

        location / {
            proxy_pass http://192.168.33.3:8080/;  
        }
    }

2. Use npm start to start react-create-app scaffolding, and it will be said that port 3000 is occupied.

question:
so, how should I set up a reverse proxy when using nginx?

server { listen 3001; -sharp server_name localhost; location / { -sharp react proxy_pass http://192.168.33.3:3000/; } location /article { -sharp restful api proxy_pass http://192.168.33.3:8000/; } }