JAVASCRIPT

react axios project importing online same products with table from fake API

import React from 'react';
import './App.css';
import axios from 'axios';


 class App extends React.Component {
  state = {
      items: [ 
          

  ]
      
  }
  componentDidMount() {
          axios.get('https://fakestoreapi.com/products')
          .then( res => {
              const items= res.data;
              this.setState({ items});
          })

  }
  render(){
      return(
          <table>
          <thead>
              <tr>
                  <th>ID</th>
                  <th>Title</th>
                  <th>Price</th>
                  <th>Description</th>
                  <th>Image</th> 
                  <th>Rating</th>
              </tr>
          </thead>
          <tbody>
              {this.state.items.map((item)  =>
                  <tr>
                      <td>{item.id}</td>
                      <td>{item.title}</td>
                      <td>{item.price}</td>
                      <td>{item.description}</td>
                   <img src={item.image}/>
                      <td>{item.rating.rate}</td>
                  </tr>)}
          </tbody>
      </table>

      )
  }
}   
export default App;