title: Display JSON output using react
body: <pre><code>import React from 'react'
  import ReactDOM from 'react-dom'
  import axios from 'axios'
  
  class ToDoList extends React.Component {
  
    constructor(props) {
      super(props)
      this.state = {
        lists: []
      }
    }
  
    componentDidMount() {
      axios.get('http://localhost:3001/api/v1/lists.json')
      .then(response =&gt; {
        console.log(response.data);
        this.setState({lists: response.data})
      })
    }
  
    render() {
      return(
        &lt;div&gt;
          {this.state.lists.map((list) =&gt; {
            return(
              &lt;div key={list.id}&gt;
                &lt;h1&gt;{list}&lt;/h1&gt;
              &lt;/div&gt;
            )
          })}
        &lt;/div&gt;
      )
    }
  }
  
  ReactDOM.render(&lt;ToDoList/&gt;, document.getElementById('root'))
  </code></pre>
  <p>I am making simple to do app in react just wanted to display the json output, however getting this error Objects are not valid as a React child, please if someone can put me on right track</p>