Notification Page

Community feedback

• 

  Krushna Sinnarkar•1,100

  @krushnasinnarkarPosted 4 months ago

  Hi @Ricardo-Tesla,

  I've noticed that your website isn't deployed to GitHub Pages. Deploying a React app to GitHub Pages is quite similar to deploying a normal HTML/CSS website. Here’s a step-by-step guide to help you deploy your React app:

  Steps to Deploy a React App to GitHub Pages

  1. Create a React App (if you haven't already):

     npx create-react-app my-app
     cd my-app
     

  2. Install the gh-pages package:

     npm install gh-pages --save-dev
     

  3. Add the homepage field to your package.json: Open your package.json file and add the following line:

     "homepage": "http://{username}.github.io/{repository-name}"
     

     Replace {username} with your GitHub username and {repository-name} with the name of your repository.

  4. Add deployment scripts to your package.json: Update the scripts section in your package.json to include the following:

     "scripts": {
       "predeploy": "npm run build",
       "deploy": "gh-pages -d build",
       ...
     }
     

  5. Initialize a Git repository and commit your changes: If you haven't initialized a Git repository in your project, do so by running:

     git init
     git add .
     git commit -m "Initial commit"
     

  6. Create a new repository on GitHub: Go to GitHub, create a new repository, and follow the instructions to push your existing project to the new repository.

  7. Deploy your app: Deploy your app by running:

     npm run deploy
     

  8. Set the source for GitHub Pages: Go to the settings of your GitHub repository, scroll down to the "GitHub Pages" section, and set the source to the gh-pages branch.

  After completing these steps, your React app should be live on GitHub Pages at http://{username}.github.io/{repository-name}.

  If you still face issues, consider looking up some tutorials on YouTube for additional guidance.

  I hope you find this helpful, and I would greatly appreciate it if you could mark my comment as helpful if it was.

  Feel free to reach out if you have more questions or need further assistance.

  Happy coding!

  Marked as helpful

  0

  ---

  

  Richard Ngabo•260

  @Ricardo-TeslaPosted 4 months ago

  I have been able to update the solution Thank you very much. @krushnasinnarkar

  0

  

  Krushna Sinnarkar•1,100

  @krushnasinnarkarPosted 4 months ago

  @Ricardo-Tesla

  You're welcome! I'm glad you were able to update the solution. If you need any more help, feel free to reach out.

  Marked as helpful

  0