GitHub Pagesを使ってサイトを公開する

はじめに

今回はGitHub Pagesの公開のやり方について記事にしました。GitHubリポジトリの作成からサイトの公開までを一連の流れにして解説しています。
GitHubアカウントの作成は省略します。

リポジトリの作成

まず、GitHub上でリポジトリを作成します。名前は何でも大丈夫です。
この時に最終的にGitHub Pagesでサイトを公開するのでprivateを選択してください。その他の項目は何も選択しないでリポジトリ作成ボタンを押します。 一旦リポジトリの作成は終了です。

ローカルリポジトリの作成

次にターミナルを使用して、ローカルリポジトリを作成していきます。

  • ローカルリポジトリを置く場所に移動する
    今回はデスクトップで作成します。(cd Desktop)

  • Desktop上でまず、git clone 作成したリポジトリのURLで自身の環境にcloneして持ってきて、cd リポジトリ名で移動する。(cloneしたらリポジトリが作成されるため)

  • cloneした後、git initしてディレクトリの初期化とgitで管理するよと宣言します。

リモートとローカルを結ぶ

以上でローカルの設定はできたので、次にローカルで編集した内容などをリモートに上げて行きたいと思います。

  • まず、git remote add origin リポジトリのURLでリモートリポジトリにアップロードする準備をします。
    (git remote -vでちゃんとリモートと結びついているか確認してみる)

  • 確認できたら、git add .でステージングエリアに乗せて、コミットする準備をします。

  • git statusなどで適宜確認しながら、次にgit commit -m "コミットメッセージ"でコミットします。

  • コミットしたら今度はgit push origin mainでローカルリポにpushします。

変更内容を取り込みたいとき

変更内容を取り込みたいときはローカルリポでmainブランチから切って作業します。(git checkout -b ブランチ名で作って、そのブランチに移動)最終的にローカルリポにpushする時に、git push origin mainブランチから切ったブランチ名でローカルリポに反映させます。

いよいよサイトを公開

変更内容などを取り込んだ後はいよいよサイトを公開します。

  • まずGithub上の作成したリポジトリのページに行って、・・・マークを押してSettingsを選択します。

  • 選択すると左のメニューバーにPagesがあるので選択します。

  • すると、Branchが最初Noneになっているのでmainを選択してSaveを押してページをリロードします。

  • しばらくしたら、Your site is live at https://username.github.io/resume/が出てくるので、そのURLを選択すると自分が作成したサイトが表示されています。

以上で一連の作業は終了で、無事GitHub Pagesを使ってサイトを公開することができました。

おわりに

少し説明が拙いですがご了承ください。細かい操作などは他の記事などを参考にしていただけると幸いです。 GitHub Pagesを使ったサイト公開の大まかな流れは説明できたんじゃないかと思います。