Displaying API calls from nodeJS inside reactJS component - node.js

Question

so I'm making an app where I had to create a nodeJS server and I have to display the API calls on the client side(reactJS). However, when I call the fetch() method, nothing gets displayed on the client side but only on the server side in my terminal. I probably don't know how to do it properly, so I was just wondering if any of you guys have an idea of what I'm doing wrong, I just want to learn, that's all. Here's small part of my server side:
const express = require('express');
const router = express.Router();
var key = "v2xcfdfa76db9f173028d97859c47a8ce0554321029a3fbfc06a26f81b1655bd3d9";
var BitGo = require('bitgo');
var client = new BitGo.BitGo({ env: 'test', accessToken: key });
router.get('/user/me', (req, res, next) => {
client.me({}, function callback(err, user) {
if (err) {
console.dir(err);
}
console.dir(user);
});
});
module.exports = router;
And here's the client side:
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
class App extends Component {
constructor(props) {
super(props);
this.state = {
data: ""
}
}
componentDidMount() {
return fetch('/user/me')
.then((response)=> response.json())
.then((responseJson)=>{
this.setState({
data: responseJson.data
});
})
}
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to React</h1>
</header>
<p className="App-intro">
Data from our API: <b>{this.state.data}</b>
</p>
</div>
);
}
}
export default App;

Answer 1

You aren't actually returning anything from the server... or so it seems with the limited code you gave us.
router.get('/user/me', (req, res, next) => {
client.me({}, function callback(err, user) {
if (err) {
console.dir(err);
res.status(400).send(err)
}
console.dir(user);
res.send({ data: user })
});
});
I'm assuming that user is JSON serializable (and that it's the data that you want returned from the server).