title: GET http://localhost:3000/api/users/:userId 400 (Bad Request) ? Axios React
body: <p>I trying to display data on the client-side of my react application. when sending a get request for single user by id on my server-side I get a 200 ok status and the user information. But when trying to make an axios call on the client-side i get 400 status error. I believe it is how I use <code>req.params</code> in the server-side get request. how can I refactor the GET request so that I can get the response on the client-side.</p>
  <p>Controller</p>
  <pre><code>router.get(&quot;/:userId&quot;, (req, res) =&gt; {
        const { userId } = req.params;
  
          if(!userId){
             return res.status(400).json({message: &quot;user id not found&quot;})
          }
  
          if(!ObjectId.isValid(userId)){
             return res.status(400).json({ message: &quot;userId  not valid&quot;})
          }
  
          User.findById(userId,(err, user) =&gt; {
              if(err) {
                  res.status(500);
                  console.log(&quot;errr 500&quot;)
              } else {
                  if(!user)
                  res.status(400).json({message:&quot;user not found&quot;});
  
                  res.status(200).json({&quot;user&quot; : user})
              }
          })
  
      })
  </code></pre>
  <p>React Component</p>
  <pre><code>import React, { Component } from 'react';
  import { Link } from 'react-router-dom'
  import axios from 'axios'
  import PropTypes from &quot;prop-types&quot;;
  import { connect } from &quot;react-redux&quot;;
  
  
  import Navbar from '../layouts/navbar'
  
  class userDashboard extends Component {
  
      state = {
          user: {}
      }
  
  
      getUser = () =&gt;{
          const userId = this.props.match.params.id;
             axios.get(`http://localhost:5000/api/users/${userId}`).then(res=&gt;{
                 const user = res.data;
                 this.setState({
                     user
                 })
             }).catch((err)=&gt; console.log(err))
          }
  
      
  
  
      componentDidMount() {
          this.getUser()
      }
      render() {
  
          const { name } = this.state.user 
          return (
              &lt;div&gt;
                  &lt;Navbar /&gt;
          &lt;h1 className=&quot;title-text&quot;&gt;Hello { name }&lt;/h1&gt;
              &lt;/div&gt;
          );
      }
  }
  
  userDashboard.propTypes = {
      // logoutUser: PropTypes.func.isRequired,
      auth: PropTypes.object.isRequired,
    };
    const mapStateToProps = (state) =&gt; ({
      auth: state.auth,
    });
    export default connect(mapStateToProps)(userDashboard);
  
  </code></pre>
  <p>server.js</p>
  <pre><code>const express = require(&quot;express&quot;);
  
  const path = require('path');
  
  const mongoose = require(&quot;mongoose&quot;);
  
  const bodyParser = require(&quot;body-parser&quot;);
  
  const passport = require(&quot;passport&quot;);
  
  const cors = require('cors')
  
  
  const app = express();
  const users = require(&quot;./controllers/api/users&quot;)
  
  
  app.use(cors());
  app.use(
  
      bodyParser.urlencoded({
          extended: false
      })
  );
  
  app.use(bodyParser.json());
  
  app.use(express.static(`${__dirname}/client/build`));
  
  
  // app.get('/*', (req, res) =&gt; {
  //     res.sendFile(`${__dirname}/client/build/index.html`)
  // })
  // app.get('/*', (req, res) =&gt; {
  //     res.sendFile(path.join(__dirname, '/../', 'build', 'index.html'));
  //  });
  
  //DATA BASE CONFIGURATION
  
  const dbkeys = require(&quot;./config/key&quot;).mongoURI;
  
  mongoose.connect( 
      dbkeys, 
      {useNewUrlParser: true} )
  
          .then(()=&gt; console.log(&quot;database connection successful&quot;))
          .catch(err =&gt; console.log(err))
  
  app.use(passport.initialize());
  require(&quot;./config/passport&quot;)(passport);
  
  
  app.use(&quot;/api/users&quot;, users);
  
  // app.use(&quot;/api&quot;, users)
  
  
  const port = 5000;
  
  app.listen( port, () =&gt; console.log(&quot;server us up and running on port 5000!&quot;))
  
  </code></pre>
  <p>Models</p>
  <pre><code>const mongoose = require(&quot;mongoose&quot;);
  
  const Schema = mongoose.Schema;
  
  const ClassworkSchema = new Schema({
      name: String,
      time: Date,
      todo: String,
      isDone: false
  });
  
  const OutcomesSchema = new Schema({
      name: String,
      time: Date,
      todo: String, 
      isDone: false,
      isApproved: false
  })
  
  const MeetupSchema = new Schema({
      name: String,
      time: Date,
      location: String,
      attended: false
  })
  const UserSchema = new Schema({
      name: {
        type: String,
        required: true
      },
      email: {
        type: String,
        required: true
      },
      password: {
        type: String,
        required: true
      },
      date: {
        type: Date,
        default: Date.now
      },
      classwork:{type: [ClassworkSchema], default: []},
      outcomes: [OutcomesSchema],
      meetups: [MeetupSchema],
    });
  
  
    // const User = mongoose.model('users', UserSchema);
    // const Classwork = mongoose.model('Classwork', ClassworkSchema );
  
    // module.exports = {
    //   User : User ,
    //   // Classwork : Classwork 
    // }
    module.exports = mongoose.model(&quot;users&quot;, UserSchema);
  </code></pre>