課外活動4
今日は,作ったウェブサイトを公開します.
公開には,GitHub Pagesを利用します.
基本的なgit操作
私はこのウェブサイトでGitについて勉強しました.非常にわかりやすいので,おすすめです.
これの入門編を一通り読んでください.
頻繁に打つコマンドとして以下のものがあります.
- git status
- ワークツリーとインデックスの状態を確認する
- git add .
- すべてのファイルをインデックスに登録する
- git commit -m "コミットメッセージ"
- コミットする
- git log
- リポジトリの変更履歴を確認する
- git push
- リモートリポジトリにアップロードする
GitHub を使う
リポジトリ作成
GitHub へログインします.
リポジトリを作ります.
右上の+ボタン,New repository をクリックします.リポジトリ名を入力し,Create repository をクリックします.

リポジトリを作ることができました.
clone
緑のボタンを押してリポジトリのアドレスを確認します.このとき,Clone with SSH となっていることを確認してください.
もし,ssh という選択肢がないのであれば, Connecting to GitHub with SSH - User Documentation で確認しながら公開鍵を登録してください.

実際にクローン(ダウンロード)してきます. クローンして期待ディレクトリに移動して,以下のコマンドを打ちます.
僕の場合,このようになります.
git clone git@github.com:iPolyomino/szm.git
Git Bash もしくはPowerShellで, git clone リポジトリ としてください.
クローン完了後,ls コマンドでそのリポジトリがクローンされていることを確認することができます.
commit & push
まず,cd でクローンしてきたディレクトリに入ってください.そして,クローンしてきたディレクトリ szm に初日に作った hello-world.html を追加します.(コピー&ペーストでOK)
git の状態を確認します.
git status
すると,以下のような結果が帰ってきます.
On branch master
Your branch is up-to-date with 'origin/master'.
Untracked files:
(use "git add <file>..." to include in what will be committed)
hello-world.html
nothing added to commit but untracked files present (use "git add" to track)
hello-world.html がgit の追跡対象となっていないことがわかります.なので,追跡対象に追加します.
git add hello-world.html
追加でたか確認します.git status を打ってください.
On branch master
Your branch is up-to-date with 'origin/master'.
Changes to be committed:
(use "git reset HEAD <file>..." to unstage)
new file: hello-world.html
追加できているようです.
インデクスに追加されたので,コミットの準備ができました.commit します.
git commit -m "add hello-world"
コミットできました.
git status で確認します.
On branch master Your branch is ahead of 'origin/master' by 1 commit. (use "git push" to publish your local commits) nothing to commit, working tree clean
最後にリモートにpush (アップロード)します.
git push
自分のリポジトリ(GitHub)を確認すると,ファイルが上がっていることを確認することができます.

GitHub Pages に公開する.
GitHub を開いて,Settingsタブに移動します.

下の方にある GitHub Pages の Source を master branch にしてsaveボタンを押します.

しばらくすると,Your site is published at https://ipolyomino.github.io/szm/ というようなメッセージが出ます.
今回,hello-world.html という名前で公開しているので,このURLの最後にhello-world.html を追加します.
https://ipolyomino.github.io/szm/hello-world.html
というように,https:// <ユーザー名> .github.io/ <リポジトリ名> / <ファイル名> とすることによってアクセスすることができるようになります.
まとめ
Git コマンドを使う
GitHub Pages でウェブサイトを公開することができる.