After deploying a Github page, how do you update it with changes?

Question

I've deployed a project as a Github Page using npm run deploy. Now, I have made new changes to my project on my master branch and pushed them to the remote master branch. However, doing so does not seem to update my Github Page. What step(s) am I missing? Do I need to re-run npm run deploy?

Flickertail

Did you compile the React code to static pages before commiting and pushing? – Mcvay

@Mcvay The first time I deployed, I ran npm run deploy first, then pushed to master. When I wanted to update my page with new changes, I just pushed those changes to master. I did not try running npm run deploy again. – Flickertail

Answer 1

After pushing your code to master branch, run npm run deploy. This will make a new commit and push to your gh-pages branch that your GitHub Pages app running on. Then refresh your page. If you don't see any changes, wait a couple minutes and refresh it again.

Forked

Answer 2

I faced some issues and found out recently. Yes, you need to deploy it again by npm run deply However, there is "Page not found" issue when you refresh the file you updated.

• In this case, I deleted the gh-pages branch in Github and deployed again. It worked in my case.

Hagio

Answer 3

All what you need is to run npm run deploy, you can customize that in your package.json under the scripts tag, this is will update your github page brunch with the last updates

Martinamartindale

Answer 4

As I'm not sure on which step you messed up I will provide you with steps from the beginning which I follow and everything works perfectly fine.

1. Create a repository for your app.

run:

npm init react-app appname

2. Install GitHub Pages package

I use this link: https://www.npmjs.com/package/gh-pages and afterwards: run:

cd appname
npm install gh-pages --save-dev

3. Modify your repos package.json file

add/change homepage per your names:

"homepage": "http://yourUserName.github.io/appname"

also to the scripts section add:

"predeploy": "npm run build",
"deploy": "gh-pages -d build"

4. Create a remote GitHub repository and initialize it

run:

git init
git remote add origin [email protected]:yourUserName/appname.git

5. deploy it to gh-pages.

run:

npm run deploy

6. Commit and push your changes

run:

git commit -m "commit description"
git push origin master

If something wouldn't work or you would have issues with some step - please leave a comment and I will try to help you

Clinker

Thanks for the overview, but my question is what happens after I have run through the steps you've outlined and I want to make subsequent changes to my app. I work on my master branch, so would I simply push changes there as I usually do? And does my Github Page update automatically? Or do I need to run npm run deploy as well as push to my master branch every time I want to update my Github Page? – Flickertail

That helped in my case: https://mcmap.net/q/1319562/-how-to-deploy-react-app-to-github-pages-for-personal-page – Peres