前期第12回 - oddmutou/jugyo-2025kyototech GitHub Wiki

(既にGitの使い方を知っていたりGitHubのアカウントを持っていたりする人は適当に聞き流しておいてください。)

Git および GitHub の使い方

本授業では、課題のソースコード提出時に可能な限りGitHubを使ってもらいます。

GitHubは、Gitで管理しているソースコードを公開したりできるものです（厳密にはそのためだけのものではないけど一旦そういう認識で…）。

GitHubを使うためにはまずGitを最低限使う必要があります。

Git 使い方

Git インストール

sudo yum install git -y

初期設定もついでにやります。デフォルトのブランチ名を決めます。(既にインストールしている場合はやらなくても大丈夫です。)

git config --global init.defaultBranch main

名前とメールアドレスも設定してください。メールアドレスは後ほどgithubに登録するメールアドレスと同一のものにしてください。

git config --global user.name "お名前 ほげ太郎"
git config --global user.email "[email protected]"

Git リポジトリの作成

Git では、「リポジトリ」という単位でソースコードを管理します。場合によって複数のリポジトリに分けたりもしますが、この授業で作業しているものは全て1つのリポジトリで扱ってもらうのが最適だと思うのでそうします。

作業しているディレクトリ(~/dockertest等?、Dockerfileを置いているディレクトリ)にcdで移動した上で、以下のコマンドを叩くだけです。

git init

コミットする

Git は、「コミット(commit)」という単位で、ソースコードの作成・編集履歴を管理します。

  1. どのファイルをコミットの対象にするか決める (git add ファイル名)
  2. コミットメッセージを決めてコミット (git commit -m "コミットメッセージ")

という2ステップでコミットします。コミットメッセージは自由に書くことができますが、どのような編集をしたのか等わかる文言にするとよいでしょう。

最初のコミット

ではまず最初のコミットを行います。

最低限の起動(docker compose up)に必要なファイルをコミットしましょう。

Dockerfile 、 compose.yml 、 nginx/ の3つがあれば、とりあえず起動はできますね。

その3つのファイルまたはディレクトリを、コミット対象に追加しましょう。

git add Dockerfile
git add compose.yml
git add nginx

ではコミットしましょう。

git commit -m "最初のコミット"

これで、コミットできました。

git log --stat といったコマンドで、どのようなファイルをどういったメッセージでコミットしたのかの履歴を確認できます。git logの結果の行が多いときは矢印キーでスクロールできます。qを押すと終了します。

phpのプログラムを含めたコミット

phpのファイル、例えば前回の授業で作成した public/bbsimagetest.php もコミットしましょう。

git add public/bbsimagetest.php
git commit -m "bbsimagetest.phpを追加"

ファイルを編集してコミット

ファイルを新しく作ったときだけではなく、編集した際にもコミットできます。編集が消えないように、都度コミットしていきましょう。

例えば、 public/bbsimagetest.php を編集したときのコミットを行ってみましょう。

まずはそのファイルを以下のように編集してみます。ページにtitleを設定しています。

vim public/bbsimagetest.php

内容例: https://github.com/oddmutou/jugyo-2025kyototech/commit/51bb11647e6e6b418be4b557b4e360344862e20b

では該当ファイルをコミットの対象に含め、コミットしましょう。

git add public/bbsimagetest.php
git commit -m "画像投稿掲示板にtitleを設定"

git log --stat で、コミットを確認してみましょう。

また、 git log -p で、コミット履歴の詳細、どのような編集をしたかを細かく閲覧できます。確認してみましょう。

GitHub 使い方

Gitが使えたら、次にGitHubを使ってみましょう。

GitHubは、会員制のウェブサービスです。手持ちの適当なメールアドレス(学校の@edu.tech.ac.jpのGメールのやつを使うと良いでしょう)を用い、会員登録しましょう。GitHubのアカウントは、複数のメールアドレスを登録可能です。卒業後も使えるように、個人のメールアドレスも登録しておくとよいでしょう。

GitHub ssh公開鍵の設定

GitHubと各作業マシン等(今回はEC2インスタンス)との通信には、SSHを用います。

まずEC2インスタンスでSSHキーペアを作ります。

ssh-keygen -t ed25519

鍵のファイル名やパスフレーズの設定等がCLI上で表示されますが、何も入力せずにEnterキーを押してください。Enterキーを3回ほど押したら、完了です。

作成したキーペアの、公開鍵は以下のように表示できます。

cat ~/.ssh/id_ed25519.pub

この公開鍵をGitHubのアカウントに紐付けます。

  1. GitHubのトップページ ( https://github.com/ ) 右上のプロフィールアイコンをクリックしてメニューを開いてください。
  2. メニューの「Settings」をクリックしてください。設定画面に遷移します。
  3. 左メニューの「SSH and GPG keys」をクリックしてください。上部に「SSH keys」と書かれている画面に遷移します。
  4. 「New SSH Keys」という緑のボタンをクリックしてください。上部に「SSH keys / Add new」と書かれている画面に遷移します。
  5. 「Title」には適当な文字列を、「Key type」はそのまま「Authentication Key」で、「Key」のところには先程の公開鍵を入力してください。無駄な改行は消してあげましょう。最後に「Add SSH Key」という緑のボタンをクリックしてください。

以上の手続きで、GitHubのアカウントに公開鍵を設定できます。

GitHub リポジトリの作成

先程、EC2インスタンス上でGitリポジトリを作成しました。以下これをローカルリポジトリと呼びます。

GitHub上にもリポジトリを作成する作業を行って、ローカルリポジトリの内容をそこに反映させることで、ソースコードを公開できます。

GitHub上のリポジトリは、リモートリポジトリと呼びます。

まずはGitHub上でリポジトリを作成してみましょう。

  1. GitHubのトップページ ( https://github.com/ ) 右上メニューの「＋」から、「New repository」をクリックし、リポジトリの作成画面に遷移してください。
  2. 「Repository name」は好きなものを入力してください。ほかはそのままで、画面下の「Create repository」という緑のボタンをクリックしてください。

これでリポジトリの作成ができました。おそらくリポジトリの画面に遷移します。

作成した GitHubのリポジトリ(リモートリポジトリ)を EC2上のリポジトリに登録

先程のGitHubのリポジトリの画面上で、「Quick setup — if you’ve done this kind of thing before」と書かれてあるしたの文字列、「[email protected]:(中略).git」みたいなやつをコピーしてください。なお、そこでHTTPSとSSHを選択できますが、後者を選択してください。これがリポジトリURLになります。

EC2上の先程コミットしたりしたところで、以下のコマンドを打ってください。

git remote add origin リポジトリURL

※「リポジトリURL」のところは、先程コピーしたリポジトリURLに置き換えてください。

これでリモートリポジトリを設定できました。

GitHubのリポジトリ(リモートリポジトリ)に反映させる

以下のコマンドで、リモートリポジトリへpushします。

git push origin main

pushできたら、ブラウザで先程のGitHubのリポジトリの画面を確認してみましょう。いろいろ見れるはずです。

演習

リポジトリのルート(Dockerfileとか置いてあるディレクトリ)に README.md という名前でファイルを作成し、コミットし、GitHubに反映させると、いい感じにブラウザから見れます。

このリポジトリはどういうものなのか、どんなコマンドで起動するのか、どのようにどんなテーブルを作成すると掲示板が動くのか、等を書いてみましょう。

マークダウン(Markdown)という形式で記述します。

マークダウンの書き方については、適当にぐぐってしらべてみてください。

例: https://qiita.com/kamorits/items/6f342da395ad57468ae3

最終課題

前期 最終課題