title: How do I properly write a table map listing in React?
body: <p>I've read tutorials and followed them but I just don't seem to fully understand it yet after staring at the code for hours. Can someone give me a proper explanation on how to properly write a table using a map in React?</p>
  
  <p>Sample map data:</p>
  
  <pre><code>[{"location_id":1,"location":"HKG","description":"Hong Kong","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":2,"location":"KUL","description":"Kuala Lumpur","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0}]
  </code></pre>
  
  <p>How I want it to appear like:
  <a href="https://i.stack.imgur.com/ipiYk.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ipiYk.jpg" alt="enter image description here"></a></p>
  
  <p>Hope you guys can help me with a proper example with a good explanation of each part because I'm still currently confused even with the docs. Thanks.</p>