20252I プログラミング1 第14回 講義資料

2025年09月18日（木）5・6時限

1 概要・連絡

1.1 課題と前期中間の成績評価

1.2 今回の講義の概要

今回の講義では Git (ギット) のインストール、VSCodeを使った GitHub リポジトリ (=リモートリポジトリ) の作成、変更内容のコミット操作・プッシュ操作、GitHubによるソースコードの公開について取り上げます。

チーム開発を支援する機能や任意の過去バージョンに戻す機能などは、次回以降に段階的に学んでいきます。今回の講義内容について、既に十分に知識・理解がある学生は、昨年度の資料ですが、先読みしておいてください。

1.3 Gitの概要

Git とはローカルPCにインストールして利用する バージョン管理システム で ソースコードの変更履歴を管理することができるアプリ (ソフト) です。また、GitHub は、1年の総合工学実験実習の「知能情報コースの実験実習テーマ」でも体験利用した「ウェブサービス」です。GitHub は (Git と連携して) 主にチーム開発の支援や、ソースコードの公開などの機能を提供してくれるものです。

Git/GitHub は、就職・進学してからは無論、高専在学中にも「各種セミナー」や「ハッカソン」「インターンシップ」「ポートフォリオづくり」「就職のエントリ」などの場面で利用します。ある程度の仕組みを分かって Git/GitHub を使えるようになっておかないと、非常に困ること (場合によっては開発チームのメンバーに迷惑をかけること) になるので、しっかりと学ぶようにしてください。

なお、Git/GitHub では「リポジトリ」「コミット」「ステージング」「プル」「プッシュ」「コンフリクト」などの専門用語が頻出することにくわえ、仕組み (概念) も初学者にとっては 極めて難解なもの になります。これらは、Git/GitHub を実際に利活用していくなかで 段階的に理解を深めて いってください。

特に、学び始めてからしばらくの間は、専門用語について調べて意味が完全理解できなくとも「呼称」「名前」として、そのまま受け入れるように努めてください (調べること自体は大切でです!)。

Git/GitHub 関連の専門用語について

野球にも「イニング」「タイムリーエラー」「セーフティバント」「チェンジアップ」など単語を聞いただけでは内容が理解も想像もできない専門用語が多数存在します。野球を経験したことがない人は、これら専門用語について丁寧に説明を受けても、イメージを掴んだり、理解したりすることはなかなかできません。しかし、用語の意味が分からなくても (拙いながらも) 実際に野球をプレーすること は可能で、それを通じて専門用語のイメージをつかみ、理解を深めることができます。

これは Git/GitHub においても同様です。学習初期では、専門用語の意味を理解しようとするよりも、まずは、それをひとつの概念や操作・処理として受け入れて、 失敗を含めた実際の経験や利用のなかで (ある程度の時間をかけながら) イメージや理解を深めていく ことが求められます。

バージョン管理とは何か、何がうれしいのか

「バージョン管理とは何か」また「バージョン管理ができると何がうれしいのか」といったことについては、ウェブ記事やYouTubeなどを参照 してください。分かりやすい解説が掲載されています。

2 Gitのダウンロードとインストール・設定

以降、PC に Visual Studio Code (VSCode) がインストールされている前提での git のインストール作業になります。VSCode のインストール・初期設定については 第09回講義 を参照してください。

既に PC に Git がインストールされている場合は、再インストールは 不要 です (そのまま利用してください) 。ただし、テキストの解説には必ず目を通して、必要に応じて設定などを変更・修正 してください。

Git の最新バージョンについて

2025年9月15日現在の Git for Windows の最新バージョンは v2.51.1.windows.1 です。

2.1 gitがインストール済みであるかの確認方法

Git が PC にインストールされているかどうかは コマンドプロンプト から git -v のコマンドを実行して確認できます。以下の例のように バージョン情報の応答 があれば、既に Git がインストールされています。

一方で「‘git -v’ は、内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチ ファイルとして認識されていません。」という応答があれば Git はインストールされていません。

C:\Users\xxxx>git -v
git version 2.51.0.windows.1

Gitのバージョンアップ

既に PC に git がインストールされている場合、コマンドプロンプトから Git update-git-for-windows を実行することで バージョンのアップデート ができます。

C:\Users\xxxx>git update-git-for-windows
Git for Windows 2.46.1.windows.1 (64-bit)
Update 2.51.0.windows.1 is available
Download and install Git for Windows v2.51.0.windows.1 [N/y]? y

上記に対して y を入力すると最新版へのアップデートが開始されます。基本的に最新版を利用するようにしてください。

Gitを再インストールする場合の注意点

(通常、この操作は必要ありません。十分な知識が無いままに実行するとシステムを破壊する場合があります)

Gitを再インストールする場合は、Windowsの「設定」-「アプリ」-「インストールされているアプリ」から Git 選択して「アンインストール」してから、再度、下記のインストール作業を行ってください。

また git の旧設定を引き継がずに完全に新規インストールと同じ状態にしたい場合は、アンインストールした後に下記のファイルも手動削除してください (あるいは .gitconfig.bak のようにリネームして無効化してください)。

2.2 GitHub の設定を確認

GitHub(https://github.com/) にログインしておきます。

就活等に利用するGitHubアカウントの準備

事前連絡しているように、就活・進学活動、インターンシップ応募に使うための GitHubアカウント を準備できているでしょうか？ このアカウント（リポジトリ）は、インターンシップ、就職、進学において、皆さんの ポートフォリオ ( 取組み経験やスキル (実力・実績) を証明するための作品集 ) という位置づけになります。

そのため、ユーザーネームは慎重に設定してください (1年次の実験実習で作成したアカウントを継続使用しても、新規に作成しても、個人使用しているものを利用してもOKです)。ユーザーネームは変更可能ですが色々と面倒があるので、この機会に適切なものにしておきましょう。

この授業で作成したプログラムのほか、他の授業 (例えれば「情報」など) や実験実習の課題も、このGitHubアカウントのリポジトリに提出していってもらいます (少なくとも教員やクラスメイトには閲覧されるものになります) 。

GitHubアカウントの継続利用

GitHubアカウントは原則として継続利用してください。頻繁に新しいアカウントを作り直す学生がいますが、就職やインターンシップの応募では「長期間の継続的な開発実績がない」と判断され不利になるので注意してください。

特に就職直前に新しいアカウントを作成すると 開発活動の記録が「ほぼゼロ」の状態に見えてしまいます。リポジトリを移しても、いわゆる「草」と呼ばれる活動履歴は引き継がれないため注意してください。

img

画面に表示される緑のマス目 (草と呼ばれる部分) は、活動の頻度や継続期間を示す重要な指標となります。採用担当者はここを見て「どの時期から安定して開発を続けてきたのか」を判断します。履歴が途切れると、それまでの努力が伝わりにくくなります。

▼ 長期的&継続的な学習や開発の実績がないと判断される例

img

GitHubにログインしている状態で、プロフィール設定のページ (https://github.com/settings/profile) にアクセスして、Public profile の「Name」の設定を確認しておきます。

これは gitインストール後の設定 で必要となる情報なのでテキストエディタなどにコピペしておいてください。なお、この Name は ユーザーネーム・表示名 (≠アカウント名) であり、アカウント名ではないことに注意 してください。

また、Nameに 日本語や絵文字を使用している場合 は、後続の作業でエラーの原因となるので修正・変更しておいてください。

img

つづいて、メール設定のページ(https://github.com/settings/emails) にアクセスして「Keep my email addresses private」と「Block command line pushes that expose my email」の項目 (ページの下部) にチェックを入れておきます。また、GitHub から付与される コミット用のメールアドレス (...@users.noreply.github.com) を確認し、テキストエディタなどにコピペしておいてください。

img

上記の設定の意味は、以下のとおりです (十分に理解できなくてもいいので、読み飛ばさずに目を通して ください)。

2.3 git のダウンロード

Gitの公式サイト にアクセスして、Windows (64bit版・Standalone Installer) の 最新版の Gitインストーラ をダウンロードしてください。約60MB程度のファイルです。

PCにアプリをインストールするためのプログラムを インストーラ (Installer) といいます。

2.4 git のインストール

ここでは Git-2.51.0-64-bit.exe を対象にインストール手順を説明します。Gitのバージョンが異なる場合は、適宜、内容を読み替えて作業を進めてください。

ダウンロードした Git-2.51.0-64-bit.exe をダブルクリックしてインストーラを起動します。

2.4.1 git のライセンスの確認

img

ライセンス (GNU General Public License : GPL) について確認して次に進みます。GNU は「グヌー」や「グヌニュー」と発音します (牛的な動物の Gnu は「ヌー」と発音しますが、ここでは「グ」をつけて発音します)。

なお、GPLは コピーレフト型ライセンス であり、OSS (オープンソースソフトウェア) のなかでも利用に際して注意すべきライセンス (知らずにライブラリなどに組み込むと恐ろしいこと💦) になります。特に、ソフトウェアやウェブサービスでビジネスを考えている場合には注意してください。

(プロンプト例)

授業で先生から「GPL（コピーレフト型ライセンス）は、OSSのなかでも利用に注意が必要です。知らずにライブラリを組み込むと問題が起きる可能性があります。特にソフトウェアやウェブサービスでビジネスを考えている場合は注意してください」と言われました。

なぜGPLは他のライセンスと比べて注意が必要なのでしょうか？また、商用開発で具体的にどんなリスクがあるのか教えてください。

GPLライセンス・コピーレフト

以下、とほほのライセンス入門 (https://www.tohoho-web.com/ex/license.html#gpl-license) からの引用です。

無償で利用・改造・再配布できますが、GPLのモジュールをライブラリとして呼び出すだけでも、呼び出したソースコード自体も GPL ライセンスとする必要があり、成果物の配布先に開発コードを公開する必要があります。これを コピーレフト とも呼びます。利用しただけでソース公開の義務が生じることから GPLに感染する ともいわれています。

2.4.2 インストール先の設定

img

Gitをインストールするフォルダを設定します。必要があれば変更して次に進みます。

2.4.3 インストールするコンポーネントの選択

img

要変更 スクリーンショットを参考に、チェックを変更してください。

注意

特に「(NEW!) Add a Git Bash Profile to Windows Terminal」には、忘れずにチェックを入れてください。このオプションを設定すると、以下のように「ターミナル」に「Git Bash」を統合することができ、便利です。

img

2.4.4 スタートメニューのフォルダ名称の設定

img

スタートメニューから「すべてのアプリ」に進んだときのフォルダ名称を設定します。必要に応じて変更し、次に進みます。

2.4.5 git で使用する既定のテキストエディタの設定

img

要変更 コンフリクト (編集内容の衝突) が発生した場合などに「自動起動するデフォルトのテキストエディタ」を設定します。Use Visual Studio Code as Git’s default editor を選択してください。

特に「Visual Studio Code」と「Visual Studio Code Insiders」の選び間違いに注意🚨してください。なお、これらは事前に VSCode がインストールされていないと選択できません。

拘りがある場合は「Vim」などの別のエディタを設定しても問題ありません。

ここで設定したデフォルトテキストエディタはどこで使用されるのか

デフォルトエディタは、コマンドラインからコミットメッセージを付けずに git commit を実行したり、コンフリクトが生じた場合に、その解消のために git によって自動起動されます。

2.4.6 初期ブランチ名称の設定 🚨

img

要変更 「Override the default branch name for new repositories (リポジトリのデフォルトのブランチ名を main でオーバーライドする)」を選択してください。2020年10月から GitHub でのデフォルトブランチ名が master から main に変更になっており、ここではこれにあわせていきます (従来 master という名称が使用されてきましたが、人権運動・人権問題の関係から最近では main という名称の使用が推奨されています)。

2.4.7 パス (環境変数) の設定

img

デフォルトの「Git from the command line and also from 3rd-party software (=コマンドラインおよびサードパーティソフトウェアからGitを使用する)」を選択します。

(プロンプト例)

Gitのインストールの途中で次のようなメッセージが表示されました。この内容について日本語で補足を加えながら説明してください。Git初心者向けを想定してください。

This option adds only some minimal Git wrappers to your PATH to avoid cluttering your environment with optional Unix tools. You will be able to use Git from Git Bash, the Command Prompt and the Windows PowerShell as well as any third-party software looking for Git in PATH.

2.4.8 デフォルト使用するSSHクライアントの選択

img

「Use bundled OpenSSH (バンドルされている OpenSSH を使用する)」を選択してください。Git とともにインストールされる ssh.exe を使用する設定になります。

2.4.9 デフォルト使用するSSL/TLSライブラリの選択

img

「Use the OpenSSL library (OpenSSLライブラリを使用する)」を選択してください。

2.4.10 改行コードに関する設定 🚨

img

要変更 「Checkout as-is, commit Unix-style line endings (そのままチェックアウトし、Unix スタイルの行末をコミットします)」を選択してください。

将来的に Docker で Linux コンテナを立ち上げ、そこにリモート接続して開発・実行することを見越して、この設定を使用します。VSCode を使用て開発する場合、改行コードが LF であっても画面表示は乱れないので、この設定で問題ありません。

2.4.11 ターミナルエミュレータの構成

img

「Use MinTTY (the default terminal of MSYS2)」を選択してください。

2.4.12 git pullのデフォルト動作設定

img

「Fast-forward or merge」を選択してください。

2.4.13 資格情報マネージャの選択

img

「Git Credential Manager」を選択してください。

2.4.14 追加オプションの設定

img

「Enable file system caching (システムのキャッシュを有効にする)」にチェックをいれてください。「Install」を押下すると実際にインストール作業が開始します。

2.4.15 完了

インストールが完了すると、次のような画面になります。「Finish」を押下してダイアログを閉じてください。

img

ここで、念のためにPCを「再起動」しておくことをお勧めします。

2.5 インストール後の Git の設定 (重要🚨)

Git と GitHub と連携させて利活用するための 重要設定 をします。

既に Git をインストール済みの場合も、このセクションの内容を必ず確認してください。

現在の Git の「グローバル設定」と「システム設定」について確認します。スタートボタンを右クリックして「ターミナル (管理者)」を起動し、ターミナルのタブを「コマンドプロンプト」に切り替えます。

img

2.5.1 現在の Git の「システム設定」の確認

Git の「システム設定」を確認するために、コマンドラインから git config --system -l を実行します。インストール直後であれば、次のような応答が返ってくると思います。

C:\Users\xxxx>git config --system -l
diff.astextplain.textconv=astextplain
filter.lfs.clean=git-lfs clean -- %f
filter.lfs.smudge=git-lfs smudge -- %f
filter.lfs.process=git-lfs filter-process
filter.lfs.required=true
http.sslbackend=openssl
http.sslcainfo=C:/Program Files/Git/mingw64/etc/ssl/certs/ca-bundle.crt
core.autocrlf=input 👈 要確認
core.fscache=true
core.symlinks=false
pull.rebase=false
credential.helper=manager
credential.https://dev.azure.com.usehttppath=true
init.defaultbranch=main 👈 要確認

ここで、必ず確認して欲しい項目が core.autocrlf=input です。

もしも core.autocrlf=true や core.autocrlf=false となっている場合は、以下のコマンドを実行して 設定を変更 してください。この設定変更コマンドは「ターミナル (管理者)」で実行しないと Permission denied で失敗するので注意してください。

git config --system core.autocrlf input

その他の項目 (インストール途中で設定した項目) についても、同様のコマンドで変更することができます。例えば、初期ブランチの名前を main から master にしたい場合は、以下のコマンドを実行します (本授業では、デフォルトブランチとして main を想定しています)。

git config --system init.defaultbranch master

Gitの「システム設定ファイル」のパス

Gitの「システム設定」は C:\Program Files\Git\etc\gitconfig に保存されています (OS環境によっては C:\Program Files (x86)\Git\etc\gitconfig となります)。

システム設定は gitconfig をエディタで直接編集することでも変更可能です。

(プロンプト例)

git config --system -l コマンドを実行ところ、次のような応答が返ってきました。まずは、上から5行目までの設定の意味を、Git 初心者向けに解説してください。

（自分のコンソールに出力された内容を貼り付ける）

2.5.2 現在の Git の「グローバル設定」の確認

次に、Git の「グローバル設定」を確認するために、コマンドラインから git config --global -l を実行します。新規インストール直後であれば、次のような応答が返ってくるはずです (xxxx の部分はユーザ名に置き換えてください)。なお、過去に Git をインストールして既に利用している場合は、その他の設定も表示されると思います。

C:\Users\xxxx>git config --global -l
core.editor="C:\Users\xxxx\AppData\Local\Programs\Microsoft VS Code\bin\code" --wait

インストールで設定したようにデフォルトエディタ設定 (= core.editor) として VSCode が設定されていることを確認してください。

Gitの「グローバル設定ファイル」のパス

Gitの「グローバル設定」は C:\Users\xxxx\.gitconfig に保存されます (xxxx の部分はユーザ名に置き換えてください)。

なお、「グローバル設定」と「システム設定」に異なる設定があった場合は グローバル設定 が優先されます。さらに、必要に応じて「ローカル設定」も追加できます。詳しくは「git ローカル設定 グローバル設定 システム設定」などでウェブ検索してください。

2.5.3 GitHub と連携させるための設定の追加🚨

重要設定 「ローカルPC上で機能する Git」と「ウェブ上で機能する GitHub」を連携させるために、次のコマンドを実行して「グローバル設定」に項目を追加します。

git config --global user.name "K.Taro"
git config --global user.email "12345678+GitHubAccountName@users.noreply.github.com"
git config --global core.quotepath false

再び、git config --global -l コマンドを実行して、以下のように設定が反映されていること を確認してください。

C:\Users\xxxx>git config --global -l
core.editor="C:\Users\xxxx\AppData\Local\Programs\Microsoft VS Code\bin\code" --wait
core.quotepath=false
user.name=K.Taro
user.email=12345678+GitHubAccountName@users.noreply.github.com

以上で、GitHub 連携に関する最低限の設定は終了です。

core.quotepathについて

core.quotepath=false にすることで git status コマンドで「変更ファイル一覧」を表示させたときに日本語のファイル名が文字化けしないようになります。

Gitの「グローバル設定」の例

ここまでの設定によって、C:\Users\xxxx\.gitconfig は、次のような内容になっているはずです。コマンド git config --global を使用せずに、直接 .gitconfig を変更しても問題ありませんが、各種エスケープには十分に注意してください。

[core]
    editor = \"C:\\Users\\xxxx\\AppData\\Local\\Programs\\Microsoft VS Code\\bin\\code\" --wait
    quotepath = false
[user]
    name = K.Taro
    email = 12345678+GitHubAccountName@users.noreply.github.com

3 リモートリポジトリの発行・変更内容のコミット

ここからは、VSCode を使って、次の操作を体験していきます。皆さんがローカルに作成したプロジェクトフォルダのソースコードが、GitHubを経由してウェブ上に公開されるようになります (チーム開発のための基盤が構築されます)。

  1. プロジェクトフォルダ GitHub-Test を作成する。
  2. GitHub-Test のなかで git init を実行し、ローカルリポジトリを作成する。
  3. GitHubにリモートリポジトリ GitHub-Test を作成する。
  4. GitHub-Test のなかのファイルを変更する。
  5. ファイルの変更をコミットし、そのコミットをリモートリポジトリにプッシュする。

注意 上記1～5の手順について「何のために何をしているのか」は、現時点では、まったく理解できないのが普通です。先述したように、Git/GitHubは非常に習得が困難な概念です。

そして、これらを理解するためには、「調べる」「試す」「考える」の3つをバランスよく実践することが不可欠です。なかでも最も重要なのは「試すこと」です。実際に手を動かしながら徐々に感覚をつかんでいくことが求められます (頭のなかで完全に理解してから使い始めるタイプのツールではありません)。

理解できないまま作業を進めることは、非常にモヤモヤとした気持ち悪さがあると思います (精神的な苦痛を感じると思います)。しかし、分からないなりに作業を繰り返していくうちに「あ、こういうことだったのか💡」と腑に落ちる瞬間が必ずやってきます。

なお、現在注目を集めている AI駆動開発ツール (Claude Code、ChatGPT Codex、GeminiCLI、Devinなど) は、利用者が Git/GitHub を普通に使えることを前提 に設計されています。Git/GitHub が使えることは、AI時代のエンジニアとして活躍するための基礎スキルとも言えます。

「リポジトリ」とは

リポジトリ (直訳すると収納庫) とは、プロジェクトを構成するファイルやフォルダ、その変更履歴を保管しておく場所を意味します。PCのローカルストレージに作成・配置するリポジトリを「ローカルリポジトリ」、GitHubなどのネットワークに作成・配置するリポジトリを「リモートリポジトリ」と言います。

なお、リモートリポジトリは中央リポジトリとよばれることもあります。

「コミット」とは

コミットとは、プロジェクトに含まれるファイルやフォルダの変更 (新規作成や削除を含む) を記録する行為、あるいは 記録そのもの を意味します。

「プッシュ」とは

プッシュとは、ローカルリポジトリの変更内容をリモートリポジトリにアップロードすることを意味します。

3.1 プロジェクトフォルダの作成

PC のドキュメントのフォルダ ( C:\Users\xxxx\Documents など) のなかに GitHub-Test という名前のフォルダ (プロジェクトフォルダ) を作成し VSCode でオープンします。

フォルダ位置は任意でOKですが、フォルダ名称は、必ずこの GitHub-Test にしてください (別の名前にしてしまうと、以下で読み替え作業が必要になります)。なお、フォルダを VSCode でオープンする方法は 第09回講義のプロジェクトフォルダの作成 参照してください。

img

以下のように、必ず GitHub-Test がプロジェクトのルート (最上位階層) になるようにしてください。

img

3.2 ファイルの追加

VSCode上から README.md というマークダウン形式のファイルを新規作成し、以下の内容を記述して保存してください。マークダウン形式 (Markdown記法) は Google Colab. (Jupyter) のテキストセルのフォーマットとして既に学習済みです、忘れてしまった場合はウェブ検索 して再学習してください。

# GitHub利用の練習
- VSCode から GitHub にリポジトリを発行
img

保存操作も、忘れずに行なってください。

3.3 リモートリポジトリの発行

VSCodeのウィンドウの左側にならぶアイコンから「ソース管理」を選択し、パネルから GitHubに公開 のボタンを押下します。

img

次のダイアログが表示されるので「許可」を押下します。

img

ウェブブラウザが自動起動し GitHub へのログインが要求されるので GitHub の Username と Password を入力して「Sign in」のボタンを押下します。

img

ウェブブラウザに、次のようなダイアログが表示されたら「Visual Studio Code を開く」のボタンを押下してください。

img

次のようなダイアログが表示されたら「開く」のボタンを押下してください (このダイアログが表示されない場合もあります)。

img

VSCode のウィンドウの上部に以下のようなドロップボックスが表示されるので「Publish to GitHub public repository ….」を選択してください。これは、このプロジェクトフォルダを GitHub-Test という名前のリポジトリとして GitHub に発行 (Publish) する、という意味になります。

img

以下のように README.md にチェックがついていることを確認して「OK」を押下します。この README.md というファイルを GitHub に発行 (Publish) するという意味になります。

img

次のダイアログが表示されるので「Sign in with your brower」を押下します。

img

ウェブブラウザの画面が自動的に次のように変わります。もし、GitHub への再ログインを求められたときは、あらためて Username と Password を入力してください。なお、この画面が表示されない場合 (単に白い画面が表示されるだけの場合) もあります。

img

Authentication Succeeded = 認証成功

VSCode に、以下のような通知「GitHubに “XXXX/GitHub-Test” リポジトリが正常に発行されました」が表示されます。通知は時間が経つと自動的に消えます。見逃してしまうかもしれませんが、問題ありません。

img

3.4 GitHub に正常発行されていることを確認

プロジェクトフォルダの内容 (=README.md) が、各自の GitHub アカウントの GitHub-Test というリポジトリに正常に発行されたことを確認します。

ウェブブラウザから https://github.com/XXXX/GitHub-Test つまり GitHub の GitHub-Test リポジトリにアクセスして、次のように README.md が表示されることを確認してください (GitHub でマークダウンファイルはレンダリングされて画面表示されます)。

img

3.5 ファイルを変更してコミット・プッシュ

プロジェクトフォルダに含まれる README.md に変更をくわえて、その変更を コミット (=変更を記録) して、さらに、それを プッシュ (=ローカルリポジトリの内容をリモートリポジトリにアップロード) していきます。

以下のように README.md にテキストを追記して 保存 してください (必ず保存処理をしてください)。

img

ソース管理のパネルで README.md 横の「+」をクリックします。この操作は ステージング といって、そのファイルを「コミット (変更履歴の記録) の対象」に含めるという意味があります。VScode のソース管理パネル内で README.md が「変更」グループから、「ステージされている変更」のグループに移動しました (画面を確認してください) 。

「ステージング」とは

ステージングとは、変更したファイルを コミットの準備として選択 (ステージ) すること を意味します。git では、ファイルの変更を直接コミットするのではなく、まずその変更をステージングエリアに追加し、その後でコミットするという流れをとります。

img

コミットメッセージ (必須・空欄にできません) を入力します。コミットメッセージには、変更内容を端的に表すような文章を書きます。ここでは update README.md とします (コミットメッセージには日本語を使用することもできます)。

img

コミットボタンの右側をクリックして「コミットして同期」を選択します。コミットして同期 とは、コミット、プッシュ、プル (フェッチとマージ) という一連の操作・処理を実行することを意味します。

img

次のようなダイアログが表示されるので「OK」または「OK, Don’t Show Again」を選択します。

img

ウェブブラウザから、再度 https://github.com/XXXX/GitHub-Test にアクセスして README.md が更新されていることを確認します。

img

4 リモートリポジトリでのファイル変更と同期

今度は、GitHub (リモートリポジトリ) 側で README.md に変更をくわえてコミットして、それをローカル側で同期させてみます。

次のように GitHub で README.md を編集モードに切り替えます。

img

次のように４行目に「GitHub（リモートリポジトリ）で README.md を直接編集してコミット」とテキストを追記して、右上の「Commit changes」のボタンを押下します。

img

ダイアログが表示されるので、次のようにコミットメッセージを記入して「Commit changes」を押下し、変更をコミットします。

img

ブラウザをリロードすると、GitHub 上で変更が反映されていることが確認できます。

img

VSCode に戻ります。この時点では、リモートリポジトリで行なった README.md の変更はまだ反映されていません。この状態を「リモートリポジトリとローカルリポジトリが同期されていない」と表現します。同期させるためには プル という操作が必要で、これは画面下のアイコンをクリックすることで行ないます。

git/GitHub では、Googleドキュメントのようにリアルタイムの自動同期はされないこと に注意してください (プログラム開発では手動による同期のほうが何かと都合がよいのです)。

img

「プル」とは

プルとは、リモートリポジトリの内容をローカルリポジトリにダウンロードして、リモートリポジトリの内容 (コミット) と、ローカルリポジトリの内容 (コミット) を統合することを意味します。

同期が成功すると、以下のようにローカルリポジトリ側にも変更が反映されます。

img

ここでは、ローカルリポジトリとリモートリポジトリの両方から README.md に対して編集を加えて、変更の統合を行ないました。同様に、チーム開発でアリスとボブが それぞれに同じファイルに対して編集を加えた際にも、GitHubを通じて変更の統合を行なうことができます (このようなチーム開発支援に関する機能は次回以降に学びます)。

以上が確認できたら VSCode を閉じてください。

5 リポジトリの削除

ここまでに作成したリモートリポジトリとローカルリポジトリは、練習用のものなので削除します。

5.1 リモートリポジトリの削除

リモートリポジトリ (GitHubに発行したリポジトリ) を削除をしてください。削除の方法については「GitHub リポジトリ 削除」で検索して実行してください。

5.2 ローカルリポジトリの削除

PCのローカルストレージに作成したプロジェクトフォルダ (=ローカルリポジトリ) を削除してください (この作業は VSCode を閉じた状態で行なってください)。なお、削除する際にフォルダのなかに .git という隠しフォルダが作成されていることを確認しておいてください。

ローカルリポジトリにおいては、この .git というフォルダのなかに変更の履歴が格納されていきます。そのため、リポジトリを削除するとき以外に .git を削除しないようにしてください。

img

6 宿題

次回の授業は、10月06日 (月) 5-6時限となります。半月以上のブランクとなります。

Git/GitHub を使えるようになるには、プログラミング以上に「経験」や「慣れ」が求められます。授業でたった1度体験しただけでは、(実際のところ) 最低限のスキルも身に付きません。

6.1 宿題①

再度、プロジェクトフォルダを新規作成し、リモートリポジトリを GitHub に発行、フォルダ内のファイルを変更・保存、変更内容のコミットとプッシュ、GitHub でのファイル変更とコミット、リポジトリの同期、リポジトリの削除という一連の操作・処理を、再度、実行してください (2回目以降は GitHub の認証などの一部操作は不要になります。実際に操作してそれを確認してください)。

この一連の作業を3回ほど繰返すと、講義資料を見なくても操作ができるようになります (授業中の1回の操作だけでは絶対に身に付かないので、繰返し練習してください) 。

次回の授業では、ここまでの git/GitHub 操作は問題なくスムーズにできることを前提として進めます。問題・不具合がある場合は、次回授業の前日までに解決しておいてください (必要に応じて担当教員にアポをとって問題解決してください)。

6.2 宿題②

1年の総合工学実験実習で取り組んだ内容 (PG1_補足資料_ホームページをつくろう) について、改めて取り組み、リポジトリの内容をウェブページとして公開する方法について復習しておいてください。

特に「GitHub Pages として公開する手順」と「最低限のHTML」については十分に理解しておいてください (単に資料を読むだけではなく、実際にPCを操作して機能することを確認してください)。

次回以降、コンフリクトの解消、GitHub からのクローン、ウェブページの作成、GitHub Pages によるウェブページ公開などについて学びます。

6.3 宿題③

git/GitHub に関するウェブ記事やYouTube動画を閲覧して予習・復習に努め理解を深めてください。様々な資料を読む、動画を見ることで理解が深まります。

Git/GitHubの情報を探す場合の注意点

ウェブや書籍で git/GitHub の入門情報を探す場合、大きく次の3パターンが存在するので注意してください。

  1. コマンドラインを使った git/GitHub の操作を説明しているページ/書籍
  2. SourceTree というソフトを使った 〃
  3. GitHub Desktop というソフトを使った 〃
  4. VSCode を使った 〃

この授業では、主に4番目の VSCode を使用する方法で解説していきます (コマンドラインも併用します)。