GitHub pages deployed with react-gh-pages updated the gh-pages branch but the app is showing 404 - reactjs

I have a website hosted with GitHub Pages at https://[username].github.io.
I have a separate deployment for the repo [username].github.io and the web page hosted at https://[username].github.io is working fine.
I recently created a react app using create-react-app and wanted to host that to Github pages. The repo name is react-gsap. Now I followed the https://github.com/gitname/react-gh-pages tutorial to deploy the app to Github pages. Once I ran npm run deploy I see that the gh-pages branch is created and it has the index.html and other files that are required to run the web app.
The problem is when I access https://[username].github.io/react-gsap I am getting 404.
Here's the repo that I created: https://github.com/atiqorin/react-gsap
What am I missing?
UPDATE:
It was just a delay. The github pages is working now. I guess it takes some time to have the page ready. Anyone having similar issue might want to wait an hour to see the changes.

Related

Can't change the url extension for the deployment of github pages

My repo: https://github.com/Ayse-Sadioglu/Portfolio
website live at: https://ayse-sadioglu.github.io/Portfolio/
I seem to have a problem publishing my website via Github pages. Everything works as it should on localhost but Github pages shows blank page. I’ve seen a few similar posts about this issue but answers not worked for me. According to answers to similar posts, I tried to remove the Portfolio extension from homepage in package.json but it didn't updated on the github pages. I mean it still shows the url that i entered before ands still shows blank page.
I have installed through npm the gh-pages module and done “npm run deploy” from https://github.com/gitname/react-gh-pages. This created my gh-pages branch. I’ve updated my package.json with the appropriate information.

Hosted react website taking a lot time to load

I just made a reactjs intermediate website hosted using netlify. Link to the hosted website: https://react-opensea-nft.netlify.app/ Yeah so its taking a lot time to load like I waited till last for it to load but at last it didn't loaded. Can someone tell me why this happens and whats the solution for this. To be specific the website was not hosting using netlify, so I had to go to site settings in netlify and add CI= npm run build

Fetching in reactjs doesn't work after deploying in github pages

So I have a reactjs app publish in github pages, is this one https://bernardoolisan.github.io/PyOcr/
The problem is that the app fetch data, but when I deploy it on github pages it give this error:
And it was working:(
And now my page doesn't work too, it was working but right now is blank i dont know why
I guess you are deploying the react project the wrong way to hosting providers such as github or netlify . First you must build your react project and then only push the files inside the build folder to hosting provider . Github pages can only serve static html css js files so it can only serve the build folder of your react project .
Note
To build a react app you can run npm run build and a build folder will be generated . Then you can push the files inside of the build folder to github repository and enable github pages for it .
I was having a similar issue, and I too though gh-pages can't fetch data. But what I did was I added cors to my server. I allowed cross-origin requests. Now it retrieves data from my server on heroku.

Deploy Frontend to GitHub Pages and Backend to Heroku

I tried deploying my backend to Heroku and after I did that my website was still working on http://localhost:3000/ but after I build the app for deployment on GitHub Pages the website stopped working on the Github page but works on the local environment.
this is my GitHub repo: https://github.com/pranjalchaplot/missedmessage/
My deployed GitHub Page (doesn't work): https://pranjalchaplot.github.io/missedmessage/
Your JavaScript references are not set correctly
as seen in your html javascript references, when you open that in a new tab, it feeds off of the "master" url, and brings you to a 404 page, you need to fix/change your reference path.
Also, the console is showing quite a few errors

Page Not Found 404 Error is Coming when pages are refreshed..................i deployed my app on git hub

enter image description here
while deploying my Reactjs app on GitHub I am facing page refresh problem, however, on localhost app is working fine, pages are refreshed and get the component.
it seems that this is a project build problem.
I need a solution for it that why this problem is coming on project build.
Also, I did not install my packages using --save flag, I am confused about that flag options.

Resources