title: Passing data from node.js to react using express
body: <p>I'm trying to call an API(which only allows server side calls) in nodejs. I manage to get the info back to my console, and now Im trying to pass that data to the app.js file of my react app. </p>
  
  <p>Im currently working with a react app a node.js back end and express to communicate between them. </p>
  
  <p>I have two folder <code>backend</code> and <code>client</code> </p>
  
  <p>This is <code>backend/server.js</code>:</p>
  
  <pre><code>const express = require("express");
  const API_PORT = 3001;
  const app = express();
  const router = express.Router();
  
    router.get("/bitmex", () =&gt; !async function(){
        const api = new BitmexAPI({
          "apiKeyID": "",
          "apiKeySecret": ""
        });
         const chatMessage = await api.Position.get()
         return(chatMessage.json({ success: true, chatMessage}))
    }())
  
    app.listen(API_PORT, () =&gt; console.log(`LISTENING ON PORT ${API_PORT}`));
  </code></pre>
  
  <p>And this is <code>client/App.js</code></p>
  
  <pre><code>import React, { Component } from "react";
  
  
   class App extends Component {
   // initialize our state 
   state = {
      data: [],
   };
  
  
  
   // when component mounts, first thing it does is fetch all existing 
   data in our db
   // then we incorporate a polling logic so that we can easily see if our db has 
   // changed and implement those changes into our UI
   componentDidMount() {
   console.log("this worked successfully")
   this.getDataFromDb();
   }
  
   getDataFromDb = () =&gt; {
       fetch("http://localhost:3001/bitmex")
       .then(data =&gt; chatMessage.json())
       .then(res =&gt; this.setState({ data: res.data }));
   };
  
  
  
  
  // here is our UI
  // it is easy to understand their functions when you 
  // see them render into our screen
  render() {
  const { data } = this.state;
  return (
    &lt;div&gt;
      &lt;ul&gt;
        //render data here somehow
      &lt;/ul&gt;
    &lt;/div&gt;
  );
  }
  }
  
  export default App;
  </code></pre>
  
  <p>The response from the API looks like this: </p>
  
  <blockquote>
  <pre><code>[
     {
      "account": 0,
      "symbol": "string",
      "currency": "string",
      "underlying": "string",
      "quoteCurrency": "string",
      "commission": 0,
      "initMarginReq": 0,
      "maintMarginReq": 0,
      "riskLimit": 0,
      "leverage": 0,
      "crossMargin": true,
      "deleveragePercentile": 0,
      "rebalancedPnl": 0,
      "prevRealisedPnl": 0,
      "prevUnrealisedPnl": 0,
      "prevClosePrice": 0,
      "openingTimestamp": "2019-02-13T18:37:44.780Z",
      "openingQty": 0,
      "openingCost": 0,
      "openingComm": 0,
      "openOrderBuyQty": 0,
      "openOrderBuyCost": 0,
      "openOrderBuyPremium": 0,
      "openOrderSellQty": 0,
      "openOrderSellCost": 0,
      "openOrderSellPremium": 0,
      "execBuyQty": 0,
      "execBuyCost": 0,
      "execSellQty": 0,
      "execSellCost": 0,
      "execQty": 0,
      "execCost": 0,
      "execComm": 0,
      "currentTimestamp": "2019-02-13T18:37:44.780Z",
      "currentQty": 0,
      "currentCost": 0,
      "currentComm": 0,
      "realisedCost": 0,
      "unrealisedCost": 0,
      "grossOpenCost": 0,
      "grossOpenPremium": 0,
      "grossExecCost": 0,
      "isOpen": true,
      "markPrice": 0,
      "markValue": 0,
      "riskValue": 0,
      "homeNotional": 0,
      "foreignNotional": 0,
      "posState": "string",
      "posCost": 0,
      "posCost2": 0,
      "posCross": 0,
      "posInit": 0,
      "posComm": 0,
      "posLoss": 0,
      "posMargin": 0,
      "posMaint": 0,
      "posAllowance": 0,
      "taxableMargin": 0,
      "initMargin": 0,
      "maintMargin": 0,
      "sessionMargin": 0,
      "targetExcessMargin": 0,
      "varMargin": 0,
      "realisedGrossPnl": 0,
      "realisedTax": 0,
      "realisedPnl": 0,
      "unrealisedGrossPnl": 0,
      "longBankrupt": 0,
      "shortBankrupt": 0,
      "taxBase": 0,
      "indicativeTaxRate": 0,
      "indicativeTax": 0,
      "unrealisedTax": 0,
      "unrealisedPnl": 0,
      "unrealisedPnlPcnt": 0,
      "unrealisedRoePcnt": 0,
      "simpleQty": 0,
      "simpleCost": 0,
      "simpleValue": 0,
      "simplePnl": 0,
      "simplePnlPcnt": 0,
      "avgCostPrice": 0,
      "avgEntryPrice": 0,
      "breakEvenPrice": 0,
      "marginCallPrice": 0,
      "liquidationPrice": 0,
      "bankruptPrice": 0,
      "timestamp": "2019-02-13T18:37:44.781Z",
      "lastPrice": 0,
      "lastValue": 0
    }
  ]
  </code></pre>
  </blockquote>
  
  <p>I m looking to get the info returned by the API rendered in the react app.</p>