基本的なgitコマンド

この章のゴール

・基本的なgitコマンドの概要と操作方法を理解する。

gitの初期設定

gitを使用する前に、初期設定を行います。

ターミナル(Terminal)を起動し、以下のコマンドを実行します。

$ git config --global user.name "ユーザー名"
$ git config --global user.email "メールアドレス"

 

設定内容を確認する場合は、以下のコマンドで確認できます。

$ git config --list

また、–listを省略して以下のように書くこともできます。

$ git config -l

基本的なgitコマンド

git init

まずは、作業ディレクトリを作成します。

$ mkdir workspace

mkdirコマンド:新しくディレクトリを作成する

次に、Vscodeで、作成したフォルダを開きます。

このディレクトリ直下に、gitのローカルリポジトリを作成します。

リポジトリの作成には、git initというコマンドを利用します。

$ cd workspace/
$ git init
Initialized empty Git repository in /home/ec2-user/environment/workspace/.git/

上記の通り表示されれば、ローカルリポジトリの作成は完了です。

cdコマンド:ディレクトリを移動する

ディレクトリ:「フォルダ」のことで、現場ではディレクトリと呼ぶのが一般的

次に、ファイルを作成します。

$ touch index.html
$ ls
index.html

このように表示されていればOKです。

touchコマンド:ファイルを作成する

lsコマンド:現在のディレクトリに存在するファイル一覧を表示する

git add

新しくファイルが追加されたので、このファイルをgitで管理できるようトラッキングに追加します。

$ git add index.html

このコマンドにより、index.htmlがトラッキング状態となり、gitで管理できるようになります。

git add -Agit add . と入力すると、現在のディレクトリ配下全てのファイルがトラッキング状態になります。

git statusコマンドでトラッキング状態を確認することができます。

$ git status
On branch master

No commits yet

Changes to be committed:
  (use "git rm --cached <file>..." to unstage)

        new file:   index.html

これにより、index.htmlがトラッキング状態にあることが確認できます。

git commit

次に、「index.htmlを追加した」という記録を残して行きます。

記録を残すことを「コミットする」と言います。

コミットには、git commit -m “コミットメッセージ” を使います。

$ git commit -m "index.htmlを追加した"
[master (root-commit) 0085a29] index.htmlを追加した
 1 file changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 index.html

git commitによって、どのような作業を行ったかという記録を残すことができ、後から見たときに、「どのような作業を行ったか」が理解しやすくなります。

git diff

次に、先ほど作成したindex.htmlを編集していきます。

Vscodeで、index.htmlをダブルクリックしてください。

すると、エディタが立ち上がり、index.htmlを直接編集できるようになります。

index.htmlを下記の通りに編集し、保存してください。

<html>
  <head>
    <meta http-equiv="content-type" charset="utf-8">
    <title>gitの学習</title>
  </head>
  <body>
    <p>Hello World !!</p>
    <p>この章では、基本的なgitコマンドについて学習します。</p>
  </body>
</html>

「保存」は以下のショートカットでも保存できます。

Macの場合「Command + S」

Windowsの場合「Ctrl + S」

では実際に、作成したhtmlファイルに対して、ブラウザからアクセスしてみましょう。

index.htmlを右クリックして、「Finderで表示します」をクリックしてください。

そして、ブラウザへドラッグ & ドロップします。

すると、以下のように、編集した内容がブラウザ上で表示されます。

ここで、前回のコミット時から、どこが変更されたかを確認してみましょう。

前回のコミットからの差分を表示するには、git diffというコマンドを利用します。

$ git diff
diff --git a/index.html b/index.html
index e69de29..c46bd69 100644
--- a/index.html
+++ b/index.html
@@ -0,0 +1,10 @@
+<html>
+  <head>
+    <meta http-equiv="content-type" charset="utf-8">
+    <title>gitの学習</title>
+  </head>
+  <body>
+    <p>Hello World !!</p>
+    <p>この章では、基本的なgitコマンドについて学習します。</p>
+  </body>
+</html>

これにより、前回のコミットからの差分が表示されました。

ここで再び、コミットします。

コミットの粒度は人それぞれですが、作業の区切りや追加した機能単位で、その都度コミットしていくのが良いです。

$ git add -A
$ git commit -m "index.htmlの内容を編集"
[master a543e9d] index.htmlの内容を編集
 1 file changed, 10 insertions(+)

以下のコマンドでは、「add」と「commit」を同時に行うことができます。

git commit -am “コミットメッセージ”

git log

次に、今までのコミット履歴を確認してみましょう。

コミット履歴の確認には、git logというコマンドを利用します。

$ git log
commit a543e9d7d1f565c9f34452ffbbbd1e568a10f048 (HEAD -> master)
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 15:50:36 2019 +0000

    index.htmlの内容を編集

commit 0085a296cac3e808bcb058548f401ec226555d8d
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 14:36:00 2019 +0000

    index.htmlを追加した

最初のコミットと、今のコミットが表示されていることが確認できます。

次に、index.htmlを、さらに編集していきます。

以下のように、index.htmlを編集し、保存してください。

<html>
  <head>
    <meta http-equiv="content-type" charset="utf-8">
    <title>gitの学習</title>
  </head>
  <body>
    <p>Hello World !!</p>
    <p>この章では、基本的なgitコマンドについて学習します。</p>
    <h1>git log</h1>
    <p>git logでは、コミット履歴を表示することができます。</p>
  </body>
</html>

 

そして再び、差分を確認した上で、コミットします。

↓変更箇所(前回のコミットとの差分)

$ git diff
diff --git a/index.html b/index.html
index c46bd69..e7c59fb 100644
--- a/index.html
+++ b/index.html
@@ -6,5 +6,7 @@
   <body>
     <p>Hello World !!</p>
     <p>この章では、基本的なgitコマンドについて学習します。</p>
+    <h1>git log</h1>
+    <p>git logでは、コミット履歴を表示することができます。</p>
   </body>
 </html>

 

↓addした上で、コミット

$ git add -A
$ git commit -m "git logの説明を追加"
[master 24011b6] git logの説明を追加
 1 file changed, 2 insertions(+)

 

ここで、git logしてみると、コミット履歴が追加されていることが確認できます。

$ git log
commit 24011b643244169a2fa0fe9cabeb6af37f714a42 (HEAD -> master)
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 16:15:48 2019 +0000

    git logの説明を追加

commit a543e9d7d1f565c9f34452ffbbbd1e568a10f048
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 15:50:36 2019 +0000

    index.htmlの内容を編集

commit 0085a296cac3e808bcb058548f401ec226555d8d
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 14:36:00 2019 +0000

    index.htmlを追加した

git reset

開発を進めてる中で、前の状態に戻したい場合があります。

そのような場合には、git resetというコマンドを利用します。

再び、index.htmlを編集していきましょう。

以下の通りエディタに入力し、保存してください。

<html>
  <head>
    <meta http-equiv="content-type" charset="utf-8">
    <title>gitの学習</title>
  </head>
  <body>
    <p>Hello World !!</p>
    <p>この章では、基本的なgitコマンドについて学習します。</p>
    <h1>git log</h1>
    <p>git logでは、コミット履歴を表示することができます。</p>
    <h1>git reset</h1>
    <p>git resetを使うと、前回コミットした状態に戻すことができます。</p>
  </body>
</html>

 

この状態で、git diffを実行すると、前回のコミットとの差分が表示されます。

$ git diff
diff --git a/index.html b/index.html
index e7c59fb..d79266b 100644
--- a/index.html
+++ b/index.html
@@ -8,5 +8,7 @@
     <p>この章では、基本的なgitコマンドについて学習します。</p>
     <h1>git log</h1>
     <p>git logでは、コミット履歴を表示することができます。</p>
+    <h1>git reset</h1>
+    <p>git resetを使うと、前回コミットした状態に戻すことができます。</p>
   </body>
 </html>

 

今回は、この変更をなかったことにして、取り消します。

コミットする前の変更を取り消す場合には、git reset –hard headというコマンドを利用します。

$ git reset --hard head
$ git diff

↑先ほどの差分が削除されていることが確認できます。

また、コミット番号を指定して、戻ることもできます。

まずは、git logでコミット履歴を確認します。

$ git log
commit 24011b643244169a2fa0fe9cabeb6af37f714a42 (HEAD -> master)
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 16:15:48 2019 +0000

    git logの説明を追加

commit 02ef8e5687e97b7fb3b21e2bd66c5efd0c7f6043
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 15:50:36 2019 +0000

    index.htmlの内容を編集

commit 0085a296cac3e808bcb058548f401ec226555d8d
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 14:36:00 2019 +0000

    index.htmlを追加した

今回は、「index.htmlの内容を編集」というコミットに戻ることにします。

git logで確認した際に表示されたコミット番号を指定することで、そのコミットに戻ることができます。

git reset --hard 02ef8e5687e97b7fb3b21e2bd66c5efd0c7f6043
HEAD is now at 02ef8e5 index.htmlの内容を編集

コミット番号は、環境毎に異なるので、ターミナルを必ず確認してください。

次に、git logで確認すると、以下のように、前の状態に戻っていることが確認できます。

$ git log
commit a543e9d7d1f565c9f34452ffbbbd1e568a10f048 (HEAD -> master)
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 15:50:36 2019 +0000

    index.htmlの内容を編集

commit 0085a296cac3e808bcb058548f401ec226555d8d
Author: wonderfulcode <sample.gmail.com>
Date:   Wed Aug 7 14:36:00 2019 +0000

    index.htmlを追加した

 

実際に、ブラウザで表示してみても、前の状態に戻っていることが確認できます。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA