SHELL

Deploying a React App* to GitHub Pages

npm install gh-pages --save-dev
package.json
//...
"homepage": "http://gitname.github.io/react-gh-pages"
//...
"scripts": {
  //...
  "predeploy": "npm run build",
  "deploy": "gh-pages -d build"
}
git init
git remote add origin https://github.com/gitname/react-gh-pages.git
npm run deploy
git add .
git commit -m "Create a React app and publish it to GitHub Pages"
git push origin master

react app deploy on github pages

 step-1: open package.json file and add this: 
 
 		"homepage": "https://myusername.github.io/my-app",
        
 step-2: install github pages form your terminal: 
 
 		 npm install --save gh-pages  
         
 step-3: add the following scripts in- scripts field in- package.json:
 
		    "predeploy": "npm run build", 
		    "deploy": "gh-pages -d build",
            
 step-4: push all changes to git: 
 
 		 git add
 		 git commit -m "your commit"
         git push 
         
 step-5: Now final command: 
 
         npm run deploy 
         
Notes: read(https://create-react-app.dev/docs/deployment/#github-pages)
       watch(https://youtu.be/Q9n2mLqXFpU?t=545)

How to deploy react app to github

In package.json add the following in this order:
	"homepage": "https://{your-github-name}.github.io/{name-of-your-repo}"

in the Scripts section, add:
	"predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    
Save and commit Changes.
Push your changes to github.

Finally, in the terminal run:
	npm run build
    
 Your react app will be successfully deployed to github pages

how to deploy react and backend to github pages

npm install gh-pages --save-dev
package.json
//...
"homepage": "http://gitname.github.io/react-gh-pages"
//...
"scripts": {
  //...
  "predeploy": "npm run build",
  "deploy": "gh-pages -d build"
}
git init

deploy react express to github pages

npm run deploy

how to build and deploy a react app to github pages

/*first things first we need to install node.js and npm then executing the command
"npm install gh-pages --save-dev" //!:usually when we need to update we need to re build and deploy so we repeeat from here
in the root directory of your react app
finaly do as follow*/
{//found in package.json
  //add the below line 
"homepage": "http://{github User Name}.github.io/{repo name}",
  //
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {        
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1"
},
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"start": "react-scripts start",
"build": "react-scripts build",
  //add 2 lines below
"test": "react-scripts test",
"eject": "react-scripts eject"
  //
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
1,
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
},
"devDependencies": {
"gh-pages": "^2.0.1"
}
//finishing with this command in root directory of the react app 
//npm run deploy