Site URL leads to an Error 404 page

[mayank-mongia]

I created a react web app and deployed it using gh-pages.
When I am opening the published page, I am seeing a blank page.
Repository Link - https://github.com/mayank-mongia/notes-app
Published Link - https://mayank-mongia.github.io/notes-app/

[gitname]

Hello @mayank-mongia, I noticed a few things I was surprised by:

1. Letter casing differences:

   The homepage value in package.json ends with Notes-App (mixed case) but the repository name is notes-app (lowercase). The person who opened Capital letters in repo name might be an issue. #39 claimed that they encountered issues when using capital letters in their repository name. I have not tested/verified that yet. In your case, you're using capital letters in the homepage property; but it's something you can investigate since letter casing is involved in both situations.

   • I recommend you try changing the homepage value to be all lowercase. Also, if that does affect the result, please let me know as I would like to address it in the tutorial.

2. Error 404 page, not blank page:

   The gh-pages branch of your repository does contain an index.html file in the root folder (✅), but visiting https://mayank-mongia.github.io/notes-app/ leads to an Error 404 page (i.e. it doesn't lead to a blank page for me).

   

   For that reason, I suspect you have not fully configured GitHub Pages as described in Step 8: https://github.com/gitname/react-gh-pages#8-configure-github-pages.

   • I recommend you re-read that section and ensure your repository is configured accordingly.

3. Old version of react-scripts:

   The version of Create React App used in your repository seems to be several years old, since it is using react-scripts version 3.2.0, which was released in 2019 (for reference, the current version is 5.0.1, which was released in 2022). When I wrote the current version of the tutorial, react-scripts was at 5.0.0 (as documented in the package.json file in this repository).

   • I recommend you use the latest version of Create React App instead. Although I don't think that is the reason for the Error 404 I'm seeing, I do think it will lead to hurdles in the long-term maintenance of your project.

Finally, I am "out of the office" right now (feeling ill 🤧), so may not respond promptly to future messages here, but I am interested in how things go for you.

[ManasiTilak]

Hi @mayank-mongia , I had a similar issue. Try adding HashRouter to your index.js.

+ import { HashRouter } from "react-router-dom";

root.render(
  <React.StrictMode>
+    <HashRouter>
      <App />
+   </HashRouter>  
  </React.StrictMode>
);

After this try deploying your application again.

[gitname]

Thanks, @ManasiTilak.

Closing because the original poster hasn't replied within 30 days.