【Git第2回】サンプルコード作成からローカルリポジトリにコミットするまで

2024.07.22更新

GitとGitHubのプログラミングメモ第2回です。何回かに分けてメモを投稿していきます。

なお、この記事はプログラミングメモですのでどんどん追記していきます。

【参考資料】
>> 【Udemy】Git：もう怖くないGit！チーム開発で必要なGitを完全マスター

【関連記事】

Gitの基本的な仕組み

データをスナップショットで保存しているため、高速でマージ可能
コミットが直前のコミットを記録しているため、コミットを辿ることで以前のバージョンに戻せる

データの保存方法

○スナップショットとして保存
×差分保存ではない

特徴

ブランチでバージョンを枝わかれさせて管理している
ブランチを統合（マージ）させる際に、高速で処理できる
コミットでバージョンを記録する

概要

ローカル／ワークツリー
↓ スナップショットを記録
ローカル／ローカルリポジトリに格納
↓ GitHubへアップ
GitHub／リモートリポジトリに格納される
↓ GitHubの記録を取得
ローカル／ローカルリポジトリ
↓ GitHubの記録を反映
ワークツリー

ローカル3つのエリア

ワークツリー　ファイルを変更する作業場
ステージ　　　コミットする変更を準備
リポジトリ　　スナップショットを記録

ワークツリー／ファイルを変更
↓ 追加（git add）
ステージ　　／変更を準備
↓ コミット(git commit)
リポジトリ　／スナップショットを記録

Gitのデータ構造のまとめ

リポジトリにGitオブジェクト（「圧縮ファイル」「ツリー」「コミット」ファイル）を作成→データを保存
コミットが親コミットを持つことで、変更履歴を辿ることができる
ポイント　データを圧縮　→ スナップショットを保存していること
Gitのコマンド：それらのデータに対して色々な操作をしている

Gitを開始する（ハンズオン）

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

ターミナルで以下のコマンドを実施

$ git init

以下が作成される

・リポジトリ
圧縮ファイル
ツリーファイル
コミットファイル
・インデックスファイル
・設定ファイル

Gitディレクトリの作成を確認

# コマンド
$ ls -la

# 実行結果
total 16
drwxr-xr-x 4 yoshi staff 128 Feb 8 20:01 .
drwxr-x---+ 42 yoshi staff 1344 Feb 8 11:42 ..
drwxr-xr-x 9 yoshi staff 288 Feb 8 20:01 .git
-rw-r--r-- 1 yoshi staff 4393 Feb 8 20:03 git-tutorial.txt

# さらに確認コマンド
ls -la .git/

# 実行結果
total 24
drwxr-xr-x 9 yoshi staff 288 Feb 8 20:01 .
drwxr-xr-x 4 yoshi staff 128 Feb 8 20:01 ..
-rw-r--r-- 1 yoshi staff 23 Feb 8 20:01 HEAD
-rw-r--r-- 1 yoshi staff 137 Feb 8 20:01 config
-rw-r--r-- 1 yoshi staff 73 Feb 8 20:01 description
drwxr-xr-x 15 yoshi staff 480 Feb 8 20:01 hooks
drwxr-xr-x 3 yoshi staff 96 Feb 8 20:01 info
drwxr-xr-x 4 yoshi staff 128 Feb 8 20:01 objects
drwxr-xr-x 4 yoshi staff 128 Feb 8 20:01 refs

Gitリポジトリのコピーを作成する場合

# コマンド
git clone <リポジトリ名>

変更をステージに加える

ワークツリー　→ ステージに変更を加える

# ターミナルで以下のコマンドを実施
git add [file-name]
git add [dir-name]
$ git add .

カレントディレクトリに以下のHTMLファイルを作成

# 作成を確認
$ ls -la

# 実行結果
total 24
drwxr-xr-x 5 yoshi staff 160 Feb 8 20:13 .
drwxr-x---+ 42 yoshi staff 1344 Feb 8 11:42 ..
drwxr-xr-x 9 yoshi staff 288 Feb 8 20:01 .git
-rw-r--r-- 1 yoshi staff 5489 Feb 8 20:13 git-tutorial.txt
-rw-r--r-- 1 yoshi staff 114 Feb 8 20:14 index.html

# ステージに追加
$ git add .

変更を記録する（コミットする）

コマンドは以下の通り

git commit
git commit -m "[messages]"
git commit -v

コミットメッセージ

完結版

変更内容、要点、理由　一行で簡潔に

正式版

1行目　変更内容
2行目　空行
3行目　変更した理由

コマンド

git commit

エラー対応

内容

$ git commit
hint: Waiting for your editor to close the file... code --wait: code: command not found
error: There was a problem with the editor 'code --wait'.
Please supply the message using either -m or -F option.

対処法

vscodeを開いて設定を行う。
コマンドパレット（　⌘ + ⇧ + p　）　にて
Shell Command:...を入力、インストール。

以下を入力して保存

initial commit
# Please enter the commit message for your changes. Lines starting
# with '#' will be ignored, and an empty message aborts the commit.
#
# On branch master
#
# Initial commit
#
# Changes to be committed:
# new file: git-tutorial.txt
# new file: index.html
#
# Changes not staged for commit:
# modified: git-tutorial.txt
#

再度コマンド
先ほど追加した「initial」が追記されていることが確認できる。

$ git commit
hint: Waiting for your editor to close the file...
[master (root-commit) 2d4f026] initial commit
2 files changed, 222 insertions(+)
create mode 100644 git-tutorial.txt
create mode 100644 index.html