ローカル環境でVSCode編集で保存した内容はコミットするまでリポジトリに影響はでません。この章ではVSCodeでファイル編集→保存→コミットまでの流れを解説します。
コミット（commit）：追加・変更したファイルをローカルリポジトリに記録すること。
ファイルを新規作成する
フォルダ内で右クリック→Codeで開くを選択でVSCodeで開いた状態。
+マークを選択しindex.htmlのファイルを作成します。
VSCodeで作ったindex.htmlファイルがエクスプローラーの方に追加されているのが確認できます。
今の段階でGitHub Desktopを開くとChangesにindex.htmlが追加されています。
VSCodeに下記コードを追加しGitHub Desktopの表示がどうなっているか確認しましょう。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Git練習</title>
</head>
<body>
<main>
<section><h1>見出し1</h1></section>
</main>
</body>
</html>コードをVSCodeに貼り付けて保存をします。
GitHub Desktopを開くとChangesにindex.htmlに記述した内容が表示されています。
GitHub Desktopでコミットはされておらず追加や変更が表示されている状態です。
コミットする
コミットする際は、コミットの内容を表すコミットメッセージを入力する必要があります。コミットメッセージはタイトルと説明を設定できますが、タイトルだけでもOKです。
Commit to masterをクリックしてNo local changesと表示されていればコミット成功です。
コミットの履歴を確認するにはHistoryに切り替えます。Historyにはこれまでのコミットが一覧で表示されており、選択するとその内容を確認することができます。
Historyの上を選択すると先ほどコミットした内容が右側に表示されます。
ファイルを編集してコミットする
コミットの仕様を理解するためにVSCodeで変更や追加した内容がGitHub Desktopでどのような表示になるか確認しましょう。
GitHub Desktopを開きRepository→Open in Visual Studio CodeでVSCodeを開きます。
VSCodeで変更し保存した後に、GitHub Desktopを開くとChangesに変更した箇所が表示されます。
削除された内容は-赤色で、追加された内容は+緑色で表示されています。コミットからの変更部分を表していて、差分といいます。
コミットメッセージを入力してCommit to masterを選択してコミットします。
Historyをクリックしてコミットされた内容を右側で確認することができます。
コミットを取り消す
コミットの取り消し方法についての解説になります。
まずは、直前のコミットを取り消す方法についてです。この方法で取り消した場合は直前のコミットは完全に消えてHistoryの履歴も残りません。
VSCodeで何かしらの文字を入力し、GitHub Desktopでコミットします。
コミット完了後、左下にUndoのボタンが表示されています。Undoは元に戻すという意味なので、ここをクリックして、直前のコミットを取り消すことができます。
※リモートリポジトリへのプッシュなどの操作を行うと、この方法では取り消せなくなります。Undoボタンはコミット後、直前取り消しに使用できます。
リバートでコミット取り消し
Undoは直前のコミットのみ取り消し可能で、リモートリポジトリへプッシュなどの操作を行うと取り消せなくなってしまいます。
リバートを使うことによって、リモートリポジトリへプッシュした内容も取り消すことができます。
リバートはコミットの取り消しというよりも、コミットによる変更を打ち消すコミットととらえた方がわかりやすいです。
一番新しい履歴のコミットで右クリック→Revert changes in commitをクリック。
リバートコミットの内容では、削除された部分が赤色で表示されています。リバートコミットはこのように履歴に残るようになっています。
リバートでコミット取り消しをする場合は、最新のコミットから順番に1つずつリバートしていきます。
一括で取り消しをしたい場合は、Git Bashのコマンドでの操作が必要になりますので、ここではふれません。
次の章ではGitで共同作業するためのリモートリポジトリについての解説になります。
![【原神】刻晴超開花パーティ 夜蘭蒸発パーティ 深境螺旋12層攻略 Genshin Impact [4K] (げんしん)](https://design-pull.com/wp-content/uploads/2022/12/gensinabyssal_spiral12_20221126-320x180.jpg)
