[Node.js] Combine Node.js + React.js

Combine Node.js + React.js

💭 How to combine Node.js and React.js?

• 🧐 Upload ‘React.js’ build folder to the ‘Node.js’ project folder

1. Build React.js project

• Build your React.js project with following command:

📋 < Ubuntu Terminal >

npm run build

• You’ll see the newly-created build directory

2. Add code lines to app.js file in Node.js project

• Write some lines to app.js file
• Serve static files (ex. images, CSS files, and JavaScript files) using express.static(file_path)

📋 < app.js >

app.use(express.static (path.join (__dirname, 'project_name/build'))); 

app.get('/', function (res, req) { 
res.sendFile(path.join (__dirname, '/project_name/build/index.html')); 
});

Server will directly send index.html in build directory when users access your webpage url.

Reference:

https://online.codingapple.com/unit/nodejs-react-integration/

Any advice and suggestions are welcome and appreciated!