To use React on GitHub Pages, you'll need to follow these steps:

Create a new repository on GitHub: Go to GitHub and create a new repository for your React project.

Set up your local development environment: Make sure you have Node.js and npm (Node Package Manager) installed on your computer. You can download them from the official Node.js website if you don't have them already.

Create a new React app: Open your terminal or command prompt and navigate to the directory where you want to create your React app. Run the following command to create a new React app:

npx create-react-app my-app This will create a new directory called my-app with a basic React project structure.

Build your React app: Once the app is created, navigate into the project directory by running cd my-app. Then, run the following command to build your React app:

npm run build This will create an optimized production build of your React app in the build directory.

Deploy to GitHub Pages: Install the gh-pages package, which will help you deploy your React app to GitHub Pages. Run the following command:

npm install gh-pages --save-dev Configure your package.json file: Open the package.json file in your project directory and add the following properties at the top level:

"homepage": "https://your-username.github.io/your-repo-name", "scripts": { "predeploy": "npm run build", "deploy": "gh-pages -d build" } Replace your-username with your GitHub username and your-repo-name with the name of your repository.

Deploy your app: In your terminal or command prompt, run the following command to deploy your React app to GitHub Pages:

npm run deploy This will create a new branch called gh-pages in your repository and push the built files from the build directory to that branch.

Enable GitHub Pages: Go to your repository on GitHub and navigate to the "Settings" tab. Scroll down to the "GitHub Pages" section and select the gh-pages branch as the source for your GitHub Pages site.

Access your deployed app: After a few moments, your React app should be deployed and accessible at the URL mentioned in the "GitHub Pages" section of your repository settings.

That's it! Your React app is now deployed on GitHub Pages. Anytime you make changes to your app, repeat steps 4 and 7 to rebuild and redeploy your app.

Hope you got your answer.

Question, does the gh-pages branch need all of the files to be pushed into it? currently, in my situation I have a 'dist' folder inside of the build folder which is what is displaying inside of my gh-pages branch. On top of this I also have a second 'dist' folder in the root directory. not sure which im supposed to keep and where.

I have deploy react website on GitHub pages but my images not showing i have images in public folder.
Please help me

Please suggest me branch structure for GitHub Pages. Should we create one main branch where all our source code is present ? and do we have to run build cmd inside of the "main" branch ? I am asking you this because I need to update the website after hosting so how should I do that
Please help me