title: How to map property and value of an object to a table?
body: <p>This is my code so far, pulling historical currency data based on a 'base' rate and selected date. Is there a way to display the data returned  in columns 'currency name' and 'rate'? My code so far is below and here: <a href="http://codepen.io/co851002/pen/PWqVwr" rel="nofollow noreferrer">http://codepen.io/co851002/pen/PWqVwr</a></p>
  
  <pre><code>var date = '2017-01-06'
  var base = 'USD'
  var API_request = 'https://api.fixer.io/' + date + '?base=' + base;
  
  var App = React.createClass({
  
    getInitialState: function() {
      return {
        rates: []
      }
    },
  
    componentDidMount: function() {
      var th = this;
      this.serverRequest =
        axios.get(API_request)
        .then(function(result) {
          console.log(result.data.rates)
          th.setState({
            rates: result.data.rates
          });
        })
    },
  
    componentWillUnmount: function() {
      this.serverRequest.abort();
    },
  
    render: function() {
      var self = this;
  
      return (
        &lt;div className="table"&gt;
      &lt;table &gt;
         &lt;thead&gt;
            &lt;tr&gt;
               &lt;th&gt;Currency&lt;/th&gt;
               &lt;th&gt;Value&lt;/th&gt;
            &lt;/tr&gt;
         &lt;/thead&gt;
         &lt;tbody&gt;
                      &lt;tr&gt;
                &lt;td&gt;Currency goes here&lt;/td&gt;  
                &lt;td&gt;Value goes here&lt;/td&gt;  
                      &lt;/tr&gt;
         &lt;/tbody&gt;
       &lt;/table&gt;
      &lt;/div&gt;
      )
    }
  });
  
  React.render(&lt;App /&gt;, document.querySelector("#root"));
  </code></pre>