title: Why does my image upload successfully in Postman form-data, but not in my react code?
body: <p>I was following Academind's tutorial on image uploads with node &amp; multer here: <a href="https://www.youtube.com/watch?v=srPXMt1Q0nY" rel="nofollow noreferrer">https://www.youtube.com/watch?v=srPXMt1Q0nY</a></p>
  
  <p>And as predicted, his code worked just fine for me. However, as soon I switched from Postman to my React code, I began to get an error that the req.file.path of the image is undefined. How can I get the image to post correctly to my back end? Here is the faulty code:</p>
  
  <p>We start with the file input and the submit button.</p>
  
  <pre><code>            &lt;label htmlFor="profilePic"&gt;Profile Picture&lt;/label&gt;
          &lt;input type="file" name="profilePic" className="inputfile" onChange={this.newFile}/&gt;
  
          &lt;section className="submit-form"&gt;
            &lt;span onClick={this.submitForm}&gt;
              &lt;p&gt;SUBMIT&lt;/p&gt;
            &lt;/span&gt;
          &lt;/section&gt;
  </code></pre>
  
  <p>There are other inputs like textareas, but they work just fine so I left those out. Anyways, I capture the inputs and set them to state.</p>
  
  <pre><code>      //Set text values to state
    newValue = e =&gt; this.setState({ [e.target.name]: e.target.value });
  
    newFile = e =&gt; this.setState({ [e.target.name]: e.target.files[0] });
  
    submitForm = () =&gt; {
      let profileData = {
        username: this.state.username,
        bio: this.state.bio,
        alignment: this.state.alignment,
        location: this.state.location,
        skills: this.state.skills,
        origin: this.state.origin,
        profilePic: this.state.profilePic
      };
  
      this.props.createProfile(profileData, this.props.history);
    };
  </code></pre>
  
  <p>Create profile is an action that posts the data using redux.</p>
  
  <pre><code>    // Create Profile
  export let createProfile = (profileData, history) =&gt; dispatch =&gt; {
    axios
      .post("/api/profile", profileData)
      .then(res =&gt; history.push("/dashboard"))
      .catch(err =&gt; dispatch({ type: GET_ERRORS, payload: err.response.data }));
  };
  </code></pre>
  
  <p>Anyways, can you guys tell me why it posts with the form-data on Postman but not React?</p>