Deploying node-react app in Heroku - fetch doesn't work - reactjs

Question

I'm trying to deploy a small react app that fetches data mlab - by a node api... locally it's working - when doing fetch - it's returns data - but when deploying to heruko - i get no data back from the Api... i'm newbie to react/node so i must have done something wrong....
Here is the api :
var express = require('express');
var cors = require('cors')
var app = express();
var morgan = require('morgan');
app.use(morgan('dev'));
var port = process.env.PORT || 3007;
var mongoose = require('mongoose');
mongoose.connect('mongodb://ggg:gggg#ds235418.mlab.com:35418/redux-form');
var db = mongoose.connection;
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', function() {
console.log("DB connection alive");
});
var User = require('./model/user');
var Message = require('./model/message');
var router = express.Router();
app.get('/messages',function(req, res) {
Message.find(function(err, messages) {
if (err)
res.send(err);
res.json(messages);
});
});
app.listen(port);
console.log('Magic happens on port ' + port);
And here is the redux action - from the react app
export function getMessages() {
const request = fetch(`http://localhost:3007/messages`, { method: 'GET' })
.then(response => response.json());
return {
type: 'GET_MESSAGES',
payload: request
}
}