Issues

Issues

Cors Issue :

Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served. CORS is applied by all modern browsers. Our requests are stopped by the browser as they consider our site(localhost:8080) to be trying to sent request to a separate origin(localhost:3000) our server.

Solution

The solution is to route the requests from our front end server which forwards it to the backend. And because the forwarded call is from server to server and not browser to server, we successfully avoid ALL pre-flight CORS requests! So to forward the requests we need to setup a proxy ,for that there is two way to do it :

• webpack.config.js :

devServer: {
  ...
  proxy: {
    '/api': 'http://localhost:3000'
  }
}

• package.json :

"proxy": "http://localhost:3000",

Keep in mind that proxy only has effect in development (with npm run dev), and it is up to you to ensure that URLs like point to the right thing in production. For more information check this article :Avoid CORS requests for a React App

Pushing unwanted file to github

Sometimes we made a lot of changes and we want to add them all to the commit so we enter 'git add . ' but the command add node_model directory and package-lock.json that we won't to add to github at all.

Solution

Git has a way to ignore files.It calls .gitignore file this file containts all the files that git should ignore.

For more information check the github Help and if you have no idea for what files you shoud not commit here is a collection for useful .gitignore template.