CODEWITHSUNDEEP
reactjsexpressherokudeploymentmern
Suman Bhattarai
Suman Bhattarai

Reputation: 211

How to Deploy React + Express Application in Heroku?

I have the folder structure like this :

I need to deploy it to heroku. Inside one of the file of react app. I have : It is the only file communicating with backend.

axios.post('http://localhost:5000/api/form' , data)
.then(()=>{
    console.log('message sent')
}).catch(err=>{
    console.log('failed');
})

Now in app.js ( backend file ) , i had :

const express = require('express') ;
const bodyParser = require('body-parser');
const nodemailer = require('nodemailer') ;
const cors = require('cors');
const port = process.env.PORT || 5000 ;

const app = express();
app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended : false}));

app.post('/api/form' , (req , res)=>{
    //something
})

app.listen(port , ()=>{
    //something
})

So, what are the things i should change or add to deploy it in heroku.

Upvotes: 1

Views: 725

Answers (1)

Arjun
Arjun

Reputation: 153

Okay there are couple of things you need to do:

lets assume , your app on heroku has name myapp, which results to https://myapp.herokuapp.com as root url

First modify your axios call to something like this:

    axios.post('http://myapp.herokuapp/api/form' , data)
    .then(()=>{
        console.log('message sent')
    }).catch(err=>{
        console.log('failed');
    })

and modify your package.json's script to reflect this:

 "build":"cd client and npm run build"

also mention engine:

"engines": {
"node": "10.x"}

Upvotes: 2

Related Questions