Bluehost – How to run a React website?

Create subdomain

Access your-main-domain.com/your-sitename to check if it works

Create React website on local

Create React website

npx create-react-app react-website-test

Config package.json file

Add homepage key with exact subdomain url value

{
   "name": "your-sitename",
   "homepage": "http://your-domain-name.com/your-sitename",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
     "react": "^15.6.0",
     "react-dom": "^15.6.0",
     "whatwg-fetch": "^2.0.3"
   },
   "devDependencies": {
     "react-scripts": "3.0.0"
    ...

Build production React website

npm install
nom install -update (if necessary)
yarn build

A new build folder is created. This is the production build

Add .htaccess file inside “build” folder

<IfModule mod_rewrite.c>

RewriteEngine On    
RewriteBase /    
RewriteRule ^index.html$ - [L]    
RewriteCond %{REQUEST_FILENAME} !-f    
RewriteCond %{REQUEST_FILENAME} !-d    
RewriteCond %{REQUEST_FILENAME} !-l    
RewriteRule . /index.html [L]   

</IfModule>

Upload React website to subdomain

Open File Manager

Create new folder inside “public_html”

Upload whole content of “build” folder into this new created folder

Please note that bluehost doesn’t upload folder and its content. You have to manually create sub-folder, then upload files into that folder.

Access your-main-domain.com/your-sitename to check if it works