-1

I had to run a nodejs app with express framework to run my react app using:

const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function(req, res) {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(9000);
console.log('server running at 9000');

Why? shouldnt the browser just run it when we build a react app application? Any explonation why we need nodejs server here to run the react app!

UPDATE: Also in my package.json I have a property proxy: "api endpoint" but when running from this the requests are made to http://localhost:3000/api/graphql instead of for ex: dev.someserver.com/api/graphql

Lulzim Fazlija
  • 865
  • 2
  • 16
  • 37
  • what exactly would the browser run? You have backend code - the browser isn't given that. Even if it is, it makes no sense to run it in the browser. [See here](https://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming) – VLAZ Apr 28 '20 at 13:11
  • While you can display HTML directly from the file system, there are quite a few restrictions to this, so it's better (and often necessary) to serve HTML and JavaScript form a (local) server so that the behaviour is closer to production world. – Joachim Sauer Apr 28 '20 at 13:14
  • @JoachimSauer why do you really mean by serving html and js from a local server, I am running already a nodejs from localhost:9000 for ex! my question is can I run a react app in production mode without nodejs and express, if not, why not? – Lulzim Fazlija Apr 28 '20 at 13:18
  • @Lulzim: yes, if you don't use server-side rendering, then you can serve your HTML code with any static file server (you'll need *some* software to serve just the static build output of your project) and it will work. – Joachim Sauer Apr 28 '20 at 13:21
  • When I try to run directly index.html into browser it shows blank! so I should need something else in order to run it on browser properly? – Lulzim Fazlija Apr 28 '20 at 13:23
  • Does this answer your question? [Why won't React production build run on the browser?](https://stackoverflow.com/questions/44371052/why-wont-react-production-build-run-on-the-browser) – E_net4 Apr 28 '20 at 14:35

2 Answers2

0

Express need to create a back-end part of application. You can run React app using only DevServer

  • i know that you can run the development mode using devServer, but why when building the app for production you have to kinda run it with some server! – Lulzim Fazlija Apr 28 '20 at 13:09
-1

What you're experiencing has been asked and answered here.
Why won't React production build run on the browser?

I created the boilerplate React app using npx create-react-app simpleapp.

I experienced the issue you are referring to. I followed the suggestion from the link above and added "homepage":"." to my package.json and it worked.

Jim Shelly
  • 11
  • 4
  • but why when doing npm build for CRA you need to deploy it or otherwise have it run from nodejs with express? so why cant just open index.html directly to browser doesnt work? sorry i am new to this! – Lulzim Fazlija Apr 28 '20 at 13:32
  • You need to build it first in order for React to convert it to javascript files. Otherwise, you're just running the application in React. When you're ready to deploy to Production, you can do an npm run build and that will convert your code to just javascript files. Then it can run in just a browser without needing Nodejs. – Jim Shelly Apr 28 '20 at 13:38
  • i have a cra application , I run npm build, and than it creates the build folder, within it i click index.html and its blank? any idea why? so to be clear I am doing this on my local machine, not using any sever or smth! – Lulzim Fazlija Apr 28 '20 at 13:44
  • Check out this link. https://stackoverflow.com/questions/44371052/why-wont-react-production-build-run-on-the-browser – Jim Shelly Apr 28 '20 at 14:08
  • So I'm not sure why I got marked down on this. Was there something I could have done differently? I'm new to posting so whatever help I can get to improve my responses is greatly appreciated. – Jim Shelly Apr 28 '20 at 14:42
  • not sure but I think your answer is more like reference to some other link and you are explaining same thing from the link reference, in such cases you could have probably just marked the question as duplicate and show the duplicate thread or smth like that so stackoverflow tries to reduce number of questions that are duplicate! – Lulzim Fazlija Apr 28 '20 at 14:58
  • @Lulzim - Thanks for the tip – Jim Shelly Apr 28 '20 at 16:23