title: How to make POST request via fetch API with local client and server?
body: <p>I am running two separate servers via webpack and express; dev server and client server.</p>
  
  <p>I have a button on client and I want to send POST request to server on button click. I am creating request by using example from <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch" rel="nofollow noreferrer">https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch</a></p>
  
  <pre><code>const testButton = document.querySelector(`button.test`);
  
  const sendRequest = event =&gt; {
      event.preventDefault(); //stop or prevents the browser from executing the default action
  
      postData(`http://localhost:8080/`, { answer: 42 }) // line:32
          .then(data =&gt; console.log(JSON.stringify(data))) // JSON-string from `response.json()` call , line:33
          .catch(error =&gt; console.error(error));
  
      function postData(url = ``, data = {}) {
          // Default options are marked with *
          return fetch(url, { // line:38
              method: 'POST', // *GET, POST, PUT, DELETE, etc.
              mode: 'no-cors', // no-cors, cors, *same-origin
              cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
              credentials: 'same-origin', // include, *same-origin, omit
              headers: {
                  'Content-Type': 'application/json',
                  // "Content-Type": "application/x-www-form-urlencoded",
              },
              redirect: 'follow', // manual, *follow, error
              referrer: 'no-referrer', // no-referrer, *client
              body: JSON.stringify(data), // body data type must match "Content-Type" header
          });
          // .then(response =&gt; response.json()); // parses JSON response into native Javascript objects
      }
  
      console.log(`sends POST request from here`);
  };
  testButton.addEventListener(`click`, sendRequest);
  </code></pre>
  
  <p>When I click on the button, I get this error:</p>
  
  <pre><code>sends POST request from here // console.log message in request
  POST http://localhost:8080/ 404 (Not Found)
  postData @ index.js:38
  sendRequest @ index.js:32
  index.js:33 {}
  </code></pre>
  
  <p>scripts in package.json</p>
  
  <pre><code>    "scripts": {
          "start": "webpack",
          "dev-server": "nodemon bin/dev localhost 8080",
          "dev-client": "webpack-dev-server --port 3000"
      }
  </code></pre>
  
  <p>devServer in webpack.config.js</p>
  
  <pre><code>
      devServer: {
          historyApiFallback: true,
          hot: true,
          inline: true,
  
          host: 'localhost',
          port: 3000,
           proxy: {
            '/api/': 'http://localhost:8080',
            }
      },
  </code></pre>
  
  <p>I have tried this for proxy</p>
  
  <pre><code>proxy: {
            '^/api/*': {
              target: 'http://localhost:8080/api/',
              secure: false
            }
          }
  </code></pre>