Skip to content

03.md

Latest commit

 

History

History
384 lines (252 loc) · 11.6 KB

03.md

File metadata and controls

384 lines (252 loc) · 11.6 KB

基本的な使い方 その 2

【目次】

  1. はじめに
  2. add, commit
  3. push, pull
  4. その他のコマンド
  5. 実際にやってみよう
  6. さいごに

【はじめに】

ここでは、最も基本的なコマンド について書いていきます。

実際に手を動かしながらやってみましょう！

【add, commit】

これらのコマンドは、ファイルの変更や追加などを行った後に使用するコマンドです。
以下のように使用します。

$ git add [変更したファイルやフォルダ名]
$ git commit -m "[コミットメッセージ]"

それぞれが何をしているかというと、

add

add は作業ディレクトリ内の変更をインデックス(ステージングエリア)に追加するコマンドです。
簡単にいうと、ファイルを変更したときにこのファイルの変更を記録するという指定をするコマンドです。

ファイル名は、実際にはファイルのパスを指定するので、srcフォルダの中のindex.jsをaddしたい場合には、

$ git add src/index.js

のように書き、現在のパス以下の全てのファイルをaddしたい場合には

$ git add .

のように書くことができます。

commit

commitはaddされたファイルの変更や追加を記録するコマンドです。
コミットメッセージにはコミットの説明を書きます。後からこのコミットメッセージを見ることができるので、何を何故やったのかなどを分かりやすく書いておくと良いです。

これらの操作はゲームのスロットがあるタイプのセーブ機能に似ています。
これによって、いくつもセーブデータを作って好きな場所に戻したり、いらないデータを消したりなどの操作に似たことをすることができます。ですので、こまめにこの作業を行いましょう。

これらのコマンドには様々な使用例があるので、気になるかたはコマンドについてもう少し詳しくを読んでみてください！

【push, pull】

これらのコマンドは、ローカルとリモートとの通信を行うためのコマンドです。

push

add, commitはローカルリポジトリに変更を保存するものなので、push を使ってコミットをリモートリポジトリへ反映させます。

使用方法は以下の通りです。

$ git push origin [ブランチ名]

このコマンドを実行すると、指定したブランチのコミット履歴などの情報をリモートリポジトリに反映させることができます。

また、main(or master)ブランチへpushしたい時は、

$ git push

のみで、リモートのmain(or master)ブランチへ反映させることができます。

pushはadd, commitのように毎回する必要はありません。
むしろpushすると後からcommitの修正をしたいときに少し大変になります。
しかし、いつまでもpushしないでいるとリモートリポジトリに反映されないままなので、良きタイミングで行いましょう。

pull

pullコマンドは、リモートリポジトリの情報をローカルに反映させるコマンドです。

使用方法は以下の通りです。

$ git pull origin [ブランチ名]

このコマンドを実行すると、指定したブランチのコミット履歴などの情報をローカルリポジトリに反映させることができます。

またpushと同様に、main(or master)ブランチをpullしたい時は、

$ git pull

のみで、ローカルのmain(or master)ブランチに反映させることができます。

pullは作業を始める前に一度しておくと良いです。

push, pullに関しても、より詳しい説明をコマンドについてもう少し詳しくに記載しているので、是非読んでみてください！

【その他のコマンド】

その他の頻出コマンドを紹介します。

status

statusコマンドは前回のコミットから変更のあったパスを表示します。
ファイルを変更した後、add, commitをする前にstatusコマンドで変更ファイルを確認しましょう。

以下のコマンドで使用できます。

git status

// ショートフォーマットで表示
$ git status -s

-sオプションを使用した場合には、以下のフォーマットで表示されます。

  • M: 変更
  • A: 追加
  • D: 削除
  • R: ファイル名の変更
  • ??: Git 管理していないファイル

addする前か後であるかどうかも上記のアルファベットの位置で見ることができます。

例:

$ git status -s
---------------------------------------
A  test.js  // add済みの追加したファイル
 M index.js // add前の変更したファイル

diff

diffコマンドは変更したファイルの直前のコミットとの差分を表示するためのコマンドです。

使い方は以下の通りです

// add前の差分を表示
$ git diff

// add済の差分を表示
$ git diff --staged

// 特定のファイルの差分を表示
$ git diff [ファイル名]

差分がある場合には、追加された行の最初には「+」が表示され、削除された行の最初には「–」が表示されます。

例:

$ git diff
---------------------
-console.log("削除した行");
+console.log("追加した行");

差分が多い時にdiffの出力を終了したい場合には、qを入力して終了させることができます。

log

logコマンドはこれまでのコミットログを表示させることができます。
コミットは新しいコミットから表示され、コミットの番号、コミットメッセージ、コミットしたユーザー、コミットした時間など、様々な情報を見ることができます。
ここでよくコミットメッセージを見て履歴を遡るので、コミットメッセージは何をやったか分かりやすく書いておくととても便利です。

使い方

$ git log
-------------------------------
commit e3be71e84675adb84ae45***********5cdeb466 (HEAD -> main, origin/main)
Author: take-cantik <take.cantik17@gmail.com>
Date:   Tue Nov 29 10:40:20 2022 +0900

    First commit

commit c69fe376dfe44271de43d***********df377a4a
Author: take-cantik <take.cantik17@gmail.com>
Date:   Tue Nov 29 00:07:28 2022 +0900

    Add: README

log表示を終了したい場合には、q を入力して終了させることができます。

logコマンドはオプションが多すぎるので、自分の見やすいように色々試して見ましょう。
個人的によく使っているのは、以下のコマンドです。

$ git log --graph --decorate --oneline --all --pretty=format:'%C(yellow)%h %Cgreen%cn %Cred%d %Creset%s'

長いので alias を登録しておくと便利です。

【実際にやってみよう】

では、実際に上記のコマンドを使って見ましょう！
基本的な流れは、以下の通りです。

  1. 作業前に pull をしてローカルを更新
  2. ファイルの変更
  3. status で変更ファイルを確認
  4. 変更ファイルを add
  5. add したファイルを commit
  6. 2~5 を繰り返す
  7. 良きタイミングで push

では、やってみよう！

1. 作業前に pull をしてローカルを更新

まずは、作業開始前にpullします。
(今回はリモートの変更は特にないですが、pullしておく癖付けのためです)

以下のコマンドを実行しましょう

$ git pull

2. ファイルの変更

先ほど作成した index.js の中身を以下のファイルのように変更してみましょう！
index_02.js

変更前

console.log("This is first commit");

変更後

console.log("Hello, world!");

3. status で変更ファイルを確認

statusコマンドで現状の変更点を確認します。

以下のコマンドを入力して、index.jsが変更されていることを確認します。

$ git status -s
-------------------------------------
 M index.js

diffコマンドで変更内容を確認してみると以下のように出力されるのを確認してみましょう。

$ git diff
------------------------------------------
diff --git a/index.js b/index.js
index 9a***43..a8***d3 100644
--- a/index.js
+++ b/index.js
@@ -1 +1 @@
-console.log("This is first commit");
+console.log("Hello, world!");

4. 変更ファイルを add

変更したindex.jsをaddします。

以下のコマンドを入力しましょう。

$ git add index.js

5. add したファイルを commit

addしたindex.jsをcommitします。

以下のコマンドを入力してください。

$ git commit -m "Change word"

logコマンドで以下のようにコミットが追加されているのを確認してみましょう。

$ git log
------------------------------------
commit 0fd973598db6d3043b54c2e7**********04bc4c (HEAD -> main)
Author: take-cantik <take.cantik17@gmail.com>
Date:   Mon Dec 5 00:44:05 2022 +0900

    Change word

commit d2154947d184e6edf262b63e**********743ccd (origin/main)
Author: take-cantik <take.cantik17@gmail.com>
Date:   Mon Dec 5 00:30:29 2022 +0900

    First commit

.
.
.

「Change word」のコミットが増えているのが分かります！

6. 2~5 を繰り返す

練習として、数回ファイルを編集してみましょう！
以下の変更をそれぞれ 2~5 の手順でコミットしてみましょう。

この時にコミットメッセージは自分の変更を後から見たときに何をやったのか分かりやすいように書くことを意識してみてください。

  1. index.jsの内容を index_03.jsのように変更
  2. README.mdをREADME.mdを参考に追加

変更前

console.log("Hello, world!");

変更後

console.log("Hello, world!");

function test() {
  console.log("test");
}

test();
# This is Git, GitHub practice repository

7. 良きタイミングで push

これまでの変更をリモートリポジトリへ反映させます。

以下のコマンドを入力してください。

$ git push

HTTPS 接続でやっていて、アクセストークンが分からなくなってしまった人は、事前準備の資料を参考に再発行しましょう。

自身の GitHub のリポジトリへ行き、変更内容が正しく反映されていることを確認しましょう！

スクリーンショット 2022-12-05 1 20 36

【さいごに】

ここで行った操作は、最も多く使うコマンドなのでたくさん書いてたくさん行っていきましょう。
最初はコミットするタイミングを分からないと思いますが、目安としては

  • 1 つのファイルを作成、実装
  • 1 つの機能を実装

などを目安にするといいと思います。

前の資料 次の資料