responding with index.html in express and react

Question

I have an express app where inside it has a create-react-app. when the user goes to root url I want to show the index.html present in create-react-app public folder. Here is my code for index.js in express app

const express = require("express");
const app = express();

app.get('/',function(req,res){


});

const PORT = process.env.PORT || 5000;
app.listen(PORT);

Here is my project directory

mikkelrd · Accepted Answer · 2018-06-27 14:00:54Z

2

You need this line: app.use(express.static('public')). See here: https://expressjs.com/en/starter/static-files.html

answered Jun 27, 2018 at 14:00

mikkelrd

4132 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

kamalakshi hegde Over a year ago

thats it? where should I add it

kamalakshi hegde Over a year ago

and how to get the path for the index.html

mikkelrd Over a year ago

for now, just add it in place of your current app.get block. that should be all you need to serve index.html, because that basically tells your express app "when there is a get request to the base url, go ahead and expose this directory, and by default respond with the contents of an index.html file if present"

kamalakshi hegde Over a year ago

I want to use res.sendFile() method inside app.get('/')

mikkelrd Over a year ago

that's fine. but the recommended way in the express docs is express.static, as shown in the link in my answer

ocespedes · Accepted Answer · 2018-06-27 14:21:36Z

1

If you want to use the sendFile() you can do something like this:

const router = express.Router();
router.get('/', (req, res) => {
    res.sendfile(path.join(__dirname, './client/public', 'index.html'));
});
app.use('/', router);

I'm using the path because depending how you start your app it might break with just the relative path.

edited Jun 27, 2018 at 14:21

answered Jun 27, 2018 at 14:12

ocespedes

1,3034 gold badges14 silver badges27 bronze badges

4 Comments

kamalakshi hegde Over a year ago

Im getting this error : Error: ENOENT: no such file or directory, stat '/Users/sriram/Desktop/public/index.html'

ocespedes Over a year ago

Yes I will update the answer it is how the path is used, given your project structure, see the updated answer now

kamalakshi hegde Over a year ago

Yes this is working my title got changed to React App, but i didnt get the body of it , is it because of bundle.js or something related . Im using create-react-app by the way inside codit(express app)

ocespedes Over a year ago

As I can see from your folder structure picture you haven't built your app, make sure to run npm run build in your React app

Collectives™ on Stack Overflow

responding with index.html in express and react

2 Answers 2

5 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related