Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Does a React application HAVE to run on its own server process?

Tags:

reactjs

I come from a background in Angular, but I wanted to start learning React. I want to make a React front-end for a nodejs Express web service.

In Angular, I could simply build the source code into a static folder with a standard index.html, and it can be deployed on any web server. With React however, every tutorial I see is about running React in its own server using create-react-app and npm start.

I know you can also just use script tags to import the React framework in a static page, but then you can't use JSX syntax, and I would like to. Is it possible to simply build a React project into a static folder with an index.html that can be deployed on any web server?

like image 830
chrispytoes Avatar asked May 23 '18 01:05

chrispytoes


People also ask

Does React need a separate server?

You don't necessarily need a static server in order to run a Create React App project in production. It also works well when integrated into an existing server side app.

Why does React have a server on its own?

The server that you see is simply to allow for the reloading of the app in response to file changes in real time. The server is only for use in development.

Does React app need a webserver?

Short answer: No. It is possible to run React locally without a traditional web server.

Does React runs a server?

React along with other framework like angular and vue. js are traditional client side framework ,they run in browser but there are technology to run this framework on server side, and next.


2 Answers

Yep, you can do what you're describing. If you want to use JSX syntax, you'll need Babel, which transpiles it into standard JavaScript.

You can avoid the complexities of setting it up by using create-react-app to create the app, then running npm build instead of npm start. This will compile everything into a build directory, complete with index.html.

like image 177
JW. Avatar answered Oct 10 '22 01:10

JW.


CRA uses its server for development purposes. You don't need CRA for using React of course. But, as your app getting bigger and bigger you will need some more extra tools. For example you want to see your code instantly without refreshing your browser. Here comes the dev server and hot reloading.

CRA uses Webpack behind the scenes. It is a great tool for bundling (obviously) all your files (including css), minifying, uglifying, optimizing your code etc.

For simple code or testing purposes using one file and attaching React and Babel to your file could be enough but for real apps you will need more. Either you will use something like Webpack on your own or you will use CRA and let it do all the extra stuff for you.

like image 1
devserkan Avatar answered Oct 10 '22 01:10

devserkan