Chapter 8: Git 入門(実践編)
Git の基本操作を実際に手を動かして学ぶ
Chapter 8: Git 入門(実践編)
概念編で学んだ知識を元に、実際にGitを操作してみましょう。このページのコマンドは全て実際にターミナルで打ちながら進めてください。
8.1 Git のインストールと初期設定
インストール確認
まず Git がインストールされているか確認します。
git --version
# git version 2.43.0 のように表示されればOKmacOS へのインストール
# Homebrew を使ったインストール
brew install gitWindows へのインストール
Git for Windows からインストーラをダウンロードして実行します。
初期設定(必須)
Git を使う前に、名前とメールアドレスを設定する必要があります。これはコミット時に「誰が変更したか」を記録するためです。
# 名前を設定
git config --global user.name "山田太郎"
# メールアドレスを設定(GitHubに登録したものと同じが望ましい)
git config --global user.email "yamada@example.com"
# 設定を確認
git config --list--global オプションをつけると、このPC全体での設定になります。プロジェクトごとに異なる設定をしたい場合は --global を外して実行します。
8.2 リポジトリの作成
新しいリポジトリを作る(git init)
# 練習用フォルダを作成
mkdir my-first-git
cd my-first-git
# Git リポジトリを初期化
git init
# Initialized empty Git repository in .../my-first-git/.git/ と表示される# .git フォルダが作られたことを確認
ls -la
# drwxr-xr-x .git ← これが Git の管理フォルダリポジトリの状態を確認する(git status)
git status
# On branch main
# No commits yet
# nothing to commit (create/copy files and use "git add" to track)git status は最もよく使うコマンドの1つです。現在の状態を把握するために、迷ったら git status を打ちましょう。
8.3 変更の記録
ファイルを作成する
# index.html を作成
echo "<h1>Hello Git!</h1>" > index.html
# 状態を確認
git status
# Untracked files:
# index.html ← まだ Git が追跡していない(赤色で表示)ステージングに追加する(git add)
# index.html をステージングに追加
git add index.html
# 状態を確認
git status
# Changes to be committed:
# new file: index.html ← ステージング済み(緑色で表示)# 全ファイルを一括でステージングに追加する場合
git add .
# ※ ピリオドは「このフォルダ以下の全て」という意味コミットする(git commit)
# メッセージをつけてコミット
git commit -m "最初のHTMLファイルを追加"
# [main (root-commit) abc1234] 最初のHTMLファイルを追加
# 1 file changed, 1 insertion(+)
# create mode 100644 index.html良いコミットメッセージの書き方:
- 何をしたかを簡潔に書く(「〜を追加」「〜を修正」「〜を削除」)
- 日本語でも英語でもOK(チームの規約に合わせる)
- 「変更した」だけでなく「なぜ変更したか」も書くと後で助かる
# 良い例
git commit -m "ログインページのバリデーションエラー表示を修正"
git commit -m "fix: login validation error message display"
# 悪い例
git commit -m "修正"
git commit -m "update"変更から記録までの流れ
8.4 履歴の確認
コミット履歴を見る(git log)
git log
# commit abc1234def5678...(コミットID)
# Author: 山田太郎 <yamada@example.com>
# Date: Fri Mar 1 10:00:00 2024 +0900
#
# 最初のHTMLファイルを追加# 1行で見やすく表示
git log --oneline
# abc1234 最初のHTMLファイルを追加
# グラフ表示(ブランチが複数ある場合に便利)
git log --oneline --graph --all変更差分を確認する(git diff)
# index.html を変更してみる
echo "<p>Git の練習中</p>" >> index.html
# まだステージングに追加していない変更を確認
git diff
# diff --git a/index.html b/index.html
# --- a/index.html
# +++ b/index.html
# @@ -1 +1,2 @@
# <h1>Hello Git!</h1>
# +<p>Git の練習中</p> ← 追加された行(+が緑色で表示)# ステージング済みの変更を確認
git add index.html
git diff --staged8.5 変更の取り消し
ステージングを取り消す
# git add してしまったファイルをステージングから外す
git restore --staged index.htmlファイルの変更を取り消す
# 作業ディレクトリの変更を取り消し(元に戻す)
# ※ 注意:この操作は取り消せません
git restore index.htmlコミットを取り消す
# 直前のコミットを取り消す(変更はステージングに残る)
git reset --soft HEAD^
# 直前のコミットを取り消す(変更も全て消える)
# ※ 注意:この操作は取り消せません
git reset --hard HEAD^注意:
git reset --hardは変更が全て消えます。チームで共有しているブランチでは使わないように注意してください。
8.6 .gitignore の書き方
.gitignore ファイルを使うと、Gitに管理させたくないファイルを指定できます。
# .gitignore ファイルを作成
touch .gitignore# .gitignore の内容例
# MacOSが自動生成するファイル
.DS_Store
# エディタの設定ファイル
.vscode/
.idea/
# パスワードや秘密鍵などの機密情報
.env
secrets.json
# 依存関係のフォルダ(サイズが大きいため)
node_modules/
# ビルド生成物
dist/
build/.env ファイルには API キーやパスワードが入ることが多いため、必ず .gitignore に追加しましょう。うっかり GitHub に公開してしまうと、悪意のある第三者に使われてしまいます。
8.7 練習問題
以下の手順で実際に操作してみましょう。
問題 1: 新しいリポジトリを作成し、README.md を追加してコミットしてください。
mkdir practice-repo
cd practice-repo
git init
echo "# 練習リポジトリ" > README.md
git add README.md
git commit -m "READMEを追加"問題 2: style.css を追加し、コミット履歴が2つになることを確認してください。
touch style.css
git add style.css
git commit -m "CSSファイルを追加"
git log --oneline
# 2つのコミットが表示されることを確認問題 3: style.css に何か文字を追記し、git diff で変更を確認してからコミットしてください。
echo "body { margin: 0; }" >> style.css
git diff # 変更確認
git add style.css
git commit -m "bodyのマージンをリセット"
git log --oneline # 3つのコミットになったことを確認まとめ
この章で学んだコマンド:
| コマンド | 用途 |
|---|---|
git init | リポジトリを初期化 |
git status | 現在の状態を確認 |
git add <file> | ステージングに追加 |
git commit -m "メッセージ" | コミット(記録) |
git log --oneline | 履歴を確認 |
git diff | 変更差分を確認 |
git restore <file> | 変更を取り消し |
次のステップ: ブランチ運用 でチーム開発の本質を学びます。