class Weather extends Component {
  state = {
    title: [],
    body: [],
    id: [],
    userId: []
  }
  componentDidMount() {
    axios.get(`https://jsonplaceholder.typicode.com/posts`)
      .then(res => {
        const title = res.data;
        const body = res.data;
        const id = res.data;
        const userId = res.data;
        this.setState({ title:title, body: body, id:id, userId: userId });
      })
  }

  render() {
    return (
      <div>
        <ul>
          {this.state.title.map(title => <li style={{listStyle: 'none'}}><strong>Title:</strong> {title.title}</li>)}
        </ul>
        <ul>
          {this.state.title.map((body) => <li style={{listStyle: 'none'}}><strong>Body:</strong> {body.body}</li>)}
        </ul>
        <ul>
          {this.state.title.map((id) => <li style={{listStyle: 'none'}}><strong>ID:</strong> {id.id}</li>)}
        </ul>
        <ul>
          {this.state.title.map((userId) => <li style={{listStyle: 'none'}}><strong>UserID:</strong> {userId.userId}</li>)}
        </ul>