Deploy React web application to shared hosting

Create React App is an officially supported way to create single-page React applications. It offers a modern build setup with no configuration

Quick Start

npx create-react-app my-app
cd my-app
npm start

If you've previously installed create-react-app globally via npm install -g create-react-app, we recommend you uninstall the package using npm uninstall -g create-react-app to ensure that npx always uses the latest version.

(npx comes with npm 5.2+ and higher)

Then open http://localhost:3000/ to see your app.

By default, Create React App produces a build assuming your app is hosted at the server root.To override this, specify the homepage in your package.json, for example:

"homepage": "http://mywebsite.com"

This will let Create React App correctly infer the root path to use in the generated HTML file.

When you’re ready to deploy to production, create a minified bundle with

npm run build or yarn build

Builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes. Your app is ready to be deployed.

Note:

If you use routers that use the HTML5 pushState history API under the hood (for example, React Router with browserHistory), many static file servers will fail. For example, if you used React Router with a route for /news/42, the development server will respond to localhost:3000/news/42 properly, but an Express serving a production build as above will not.

This is because when there is a fresh page load for a /news/42, the server looks for the file build/news/42 and does not find it. The server needs to be configured to respond to a request to /news/42 by serving index.html

If you’re using Apache HTTP Server, you need to create a .htaccess file in the public folder that looks like this:

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

That is all...