title: How to use the same port for React Js and Node Js?
body: <p>Actually, I am looking to create the contact form in the website using reactjs and nodejs. I have created the form using the React and for the backend, I have to connect the node js so that I can receive the email. But it is not happening
  Both React and Node should run on the same port. I have given a proxy as "<a href="http://localhost:3000" rel="noreferrer">http://localhost:3000</a>" in the package.json but still, it's not working.</p>
  
  <p><strong>I have given both the react js and node js code. Please help me to solve this error.</strong> </p>
  
  <h2>React JS Code</h2>
  
  <pre><code>import React, { Component } from "react";
  import axios from "axios";
  
  export default class formSection extends Component {
    state = {
      name: "",
      email: "",
      subject: "",
      comment: ""
    };
  
    handleChange = e =&gt; {
      this.setState({
        [e.target.name]: e.target.value
      });
    };
  
   async handleSubmit(e) {
      e.preventDefault()
      const {name, email, subject, comment} = this.state
  
      const contact = await axios.post('/api/contact', {
  
          name,
          email,
          subject,
          comment
  
      })
  
    };
  
    render() {
      return (
        &lt;section
          className="wow fadeIn big-section"
          id="section-down"
          style={{ visibility: true }}
        &gt;
          &lt;div className="container"&gt;
            &lt;div className="row equalize sm-equalize-auto"&gt;
              &lt;div
                className="col-md-6 col-sm-12 col-xs-12 sm-margin-30px-bottom wow fadeInLeft"
                style={{ visibility: true, height: 597 }}
              &gt;
                &lt;div className="padding-fifteen-all bg-light-gray border-radius-6 md-padding-seven-all xs-padding-30px-all height-100"&gt;
                  &lt;span className="text-extra-dark-gray alt-font text-large font-weight-600 margin-25px-bottom display-block"&gt;
                    Ready to get started?
                  &lt;/span&gt;
                  &lt;form id="contact-form" onSubmit={e=&gt;this.handleSubmit(e)} method="POST"&gt;
                    &lt;div&gt;
                      &lt;div
                        id="success-contact-form"
                        className="no-margin-lr"
                        style={{ display: true }}
                      /&gt;
                      &lt;input
                        type="text"
                        name="name"
                        id="name"
                        value={this.state.name}
                        placeholder="Name*"
                        className="border-radius-4  medium-input"
                        onChange={this.handleChange}
                      /&gt;
                      &lt;input
                        type="text"
                        name="email"
                        value={this.state.email}
                        id="email"
                        placeholder="E-mail*"
                        className="border-radius-4  medium-input"
                        onChange={this.handleChange}
                      /&gt;
                      &lt;input
                        type="text"
                        name="subject"
                        id="subject"
                        value={this.state.subject}
                        placeholder="Subject"
                        className="border-radius-4  medium-input"
                        onChange={this.handleChange}
                      /&gt;
                      &lt;textarea
                        name="comment"
                        id="comment"
                        value={this.state.comment}
                        placeholder="Your Message"
                        rows="5"
                        className="border-radius-4  medium-textarea"
                        onChange={this.handleChange}
                      /&gt;
                      &lt;button
                        id="contact-us-button"
                        type="submit"
                        className="btn btn-small border-radius-4 btn-dark-gray"
  
                      &gt;
                        send message
                      &lt;/button&gt;
                    &lt;/div&gt;
                  &lt;/form&gt;
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;div
                className="col-md-6 col-sm-12 col-xs-12 last-paragraph-no-margin wow fadeInRight"
                style={{ visibility: true, height: 597 }}
              &gt;
                &lt;div className="padding-ten-all bg-light-gray border-radius-6 md-padding-seven-all xs-padding-30px-all height-100 sm-text-center"&gt;
                  &lt;img
                    src="images/about-img1.jpg"
                    alt=""
                    className="border-radius-6 margin-35px-bottom xs-margin-30px-bottom"
                    data-no-retina=""
                  /&gt;
                  &lt;span className="text-large font-weight-600 alt-font text-extra-dark-gray margin-5px-bottom display-block"&gt;
                    Let's plan for a new project?
                  &lt;/span&gt;
                  &lt;p&gt;
                    Lorem Ipsum is simply dummy text of the printing and
                    typesetting industry, Lorem Ipsum has been the standard dummy
                    text.
                  &lt;/p&gt;
                  &lt;a
                    href="about-us-modern.html"
                    className="btn btn-dark-gray btn-small text-extra-small border-radius-4 margin-25px-top"
                  &gt;
                    About Company
                  &lt;/a&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/section&gt;
      );
    }
  }
  </code></pre>
  
  <h2>Node JS Code</h2>
  
  <pre><code>const express = require('express');
  const bodyParser = require('body-parser');
  const nodemailer = require('nodemailer');
  const app = express();
  
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({extended:false}));
  
  app.post('/api/contact', (req, res) =&gt; {
  
  console.log(req.body);
  
  });
  
  
  
  
  const PORT = process.env.PORT || 3000;
  app.listen(PORT, () =&gt; {
  
      console.log(`server listening in port ${PORT}`);
  
  })
  </code></pre>