Heroku Deployment Nodejs - node.js

Question

I developed a app using react, mongodb, express, nodeJS. I am able to run the app perfectly in my desktop. I have run express & react on different ports. But this doesn't work when I deploy it to heroku.
server.js
const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
var Schema = mongoose.Schema;
var session = require('express-session');
var cookieParser = require('cookie-parser');
var cors=require('cors');
//setup express app
const app = express();
app.use(cors());
//connect to mongodb
mongoose.connect(process.env.MONGODBURI);
mongoose.Promise = global.Promise;
//connect public folder
app.use(express.static('public'));
//bodyparser middleware
app.use(bodyParser.json());
//routes middleware
app.use(cookieParser())
app.use(session({secret: 'MySecret'}));
app.use('/userapi',require('./routes/userapi.js'));
app.use('/cde',require('./routes/cde.js'));
app.use('/efg',require('./routes/efg.js'));
//error handler middleware
app.use(function(err,req,res,next){
res.status(422).send({error: err.message});
});
const port = process.env.PORT || 8080;
app.listen(port, () => {
console.log('Express server listening on port', port)
});
package.json
{
"name": "vip",
"version": "0.1.0",
"private": true,
"dependencies": {
"afterglow": "0.0.3",
"afterglowplayer": "^1.1.0",
"axios": "^0.17.1",
"body-parser": "^1.18.2",
"cookie-parser": "^1.4.3",
"cookieparser": "^0.1.0",
"cors": "^2.8.4",
"express": "^4.16.2",
"express-session": "^1.15.6",
"foreman": "^2.0.0",
"fs": "0.0.1-security",
"gifffer": "^1.5.1",
"glamor": "^2.20.40",
"image-map-resizer": "^1.0.3",
"jquery": "^3.3.1",
"marked": "^0.3.12",
"mongoose": "^5.0.1",
"natural": "^0.5.6",
"react": "^16.2.0",
"react-data-menu": "^1.1.1",
"react-dom": "^16.2.0",
"react-gif": "^0.1.0",
"react-modal": "^3.1.13",
"react-scripts": "1.1.0",
"react-toastify": "^3.4.2",
"redux": "^3.7.2",
"shelljs": "^0.8.1",
"video-react": "^0.9.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"nodemon": "^1.14.12",
"react-router-dom": "^4.2.2"
}
}
I've pushed all the code to heroku and I've set the mongodb uri to mlab in heroku dashboard settings. When I request express it gives me a error
GET https://myappname.herokuapp.com/userapi/verifylogin?email=aa&password=aa 404 (Not Found)
createError.js:16 Uncaught (in promise) Error: Request failed with status code 404
at createError (createError.js:16)
at settle (settle.js:18)
at XMLHttpRequest.handleLoad (xhr.js:77)
userapi`
const express = require('express');
const router = express.Router();
const User = require('../models/Login');
const LoginSession = require('../models/LoginSession');
const server = require('../server');
//find a record matching username & Password
router.get('/verifylogin',function(req,res,next){
User.findOne({email:req.query.email,password:req.query.password}).then(function(sequence_data){
res.send(sequence_data);
});
});
module.exports = router;
`
I've gone through many other posts related, but didn't resolved it.