見出し画像

【Codesandboxを利用して、GitHub Pagesの公開に進む手順❤】/GitHub Pagesに更新が反映されない!/ master branchにコミットしてすぐにGitHub Pagesに反映されるわけではありません。1〜2時間ほどかかる❤

TechCommit個人制作2021で、【GitHub Pagesを利用しての公開】を初めて実施しました。

【Codesandboxを利用して、GitHub Pagesの公開に進む手順】と困った事のご報告noteです。※Git初学者のまとめです。ご承知おきください。

【困った事】

GitHub Pages を使った静的サイトの公開方法にトライしましたが、GitHub Pagesに更新が反映されない。

具体的には、GitのURL※例【https://yukiko1026.github.io/usasa/】を、保存後にすぐ5~10分後に選んでも、エラーが発生して開けない事が発生。

原因を調査・・・

noteライターのnpakaさんから、原因の理由を教わりました。

今後の為の綴りますね。

npakaさんのnoteを引用いたします。

“GitHub Pagesに更新が反映されない master branchにコミットしてすぐにGitHub Pagesに反映されるわけではありません。1〜2時間ほどかかります。”

npakaさん、ありがとうございます。

感謝しています。


【Codesandboxを利用して、GitHub Pagesの公開に進む手順】※簡単まとめ

【Codesandbox】

1: staticにて、HTML・CSS・JSのコード書く。保存する。

2:画面左のGitの猫マークを押す。🐈

3:「Export to new GitHub repository」の下の【repositoryname...】にマウスを持っていく。名前を付けて、保存する。※例:usausa(兎画像) ⇒【creating repository】と表示されます♪

【GitHub】

4:顔写真下の、【Your repositories】をクリックする。

5:【Your repositories】にて、4で作成した【repositoryname...】※例:usausa(兎の画像)を探して、選択する。

6:【Settings】を、選ぶ。※右の方に有ります。

7: 【GitHub Pagesの設定をNone⇒Savaに変更する】

《最初の画面》

GitHub Pages

Source
GitHub Pages is currently disabled. Select a source below to enable GitHub Pages for this repository. Learn more.

None▼

Save

《やり方メモ》

GitHub Pages

Source
GitHub Pages is currently disabled. Select a source below to enable GitHub Pages for this repository. Learn more.

None▼ 

8:None▼の下三角形をクリックで、選択オプションが表示されるので、【main】に設定変更行う(´ー`*)♪

9:Saveボタンを押す。

10:公開反映まで、1時間~2時間待つ。※早いときはすぐ反映されます。

11:【Settings】の下記ページの、URL

※例【https://yukiko1026.github.io/usasa/】をクリックして、公開出来ているか調査する(^^)

《GitHub画面》

GitHub Pages
GitHub Pages is designed to host your personal, organization, or project pages from a GitHub repository.

Your site is ready to be published at https://yukiko1026.github.io/usasa/.
Source 
                                   ↑ここに注目(*^-^*)❤
Your GitHub Pages site is currently being built from the main branch. Learn more.

以上です。

<他、TechCommitで井上慎也さんに教わった記事を参考に進めました。>

【GitHub Pages を使った静的サイトの公開方法が、とても簡単になっていた】

おわり。

※拙い簡単な、まとめですが、お役に立てば嬉しいです(⌒∇⌒)♪





この記事が参加している募集

この記事が気に入ったらサポートをしてみませんか?