title: displaying collection data from mongodb using axios in reactjs
body: <p>I am new to MERN and I try to display data from mongodb collection using axios. I try to display a list of cities on the web page. I am not sure if I am doing it write. Should I use super state?json<a href="https://i.stack.imgur.com/6dFXy.png" rel="nofollow noreferrer">postman</a></p>
  
  <p>Here is my reactjs code:</p>
  
  <pre><code>    import React, { Component } from 'react';
  import axios from 'axios';
  
  export class Cities extends Component {
  constaractor(state) {
  
    state = {
    locations:[]
    };
  }
  
    componentDidMount() {
      axios.get('/cities')
      .then(cities =&gt; console.log(cities.data))
      .catch(e =&gt; console.log(e))
    }
    render() {
      const cities=this.state.locations.map(location =&gt; (
        &lt;div key={location._id}&gt;
       &lt;h1&gt;{location.city}&lt;/h1&gt;
        &lt;p&gt;{location.contry}&lt;/p&gt;
          &lt;h1&gt;Cities&lt;/h1&gt;
        &lt;/div&gt;
      ));
  
      return (
        &lt;div className="Cities"&gt;
          {cities}
        &lt;/div&gt;
      );
    }
  }
  
  export default Cities
  </code></pre>