Web制作・ホームページ制作 埼玉で依頼するなら伝助(DENSUKE)へ。越谷を中心に草加、八潮、春日部など埼玉県近郊に対応!

DENSUKE BLOG DENSUKE BLOG

NEW

猫でも分かった気になる Git 入門

この記事では Backlog の Git を使って雑に解説していこうと思います
この記事はとりあえずGitが使える気になることが目標です
多分猫には理解できないです
正直 こっち見たほうが良いです
サルでもわかるGit入門

環境

  • windows 7
  • sourcetree

Git て 何?

wikipedia

Git(ギット[2][3][4])は、プログラムのソースコードなどの変更履歴を記録・追跡するための分散型バージョン管理システムである。

だそうです
「プログラムのソースコード」とありますが、大抵のファイルなら大丈夫です

Gitクライアントをインストール

とりあえずwindowsだろうがmacだろうがこれをインストール(インストールはアカウント作ったり話が長くなるのでググってね)
Sourcetree

本来Gitは黒い画面でコマンドを入力して使うものですが、
Gitクライアントを使えば簡単な操作であればコマンドを覚えたりする必要はないです

使ってみる

Gitリポジトリをつくる

リポジトリ とは データを保管しておく場所のことです。
Gitの履歴データや設定が保存されます。

てきとーにフォルダを作る

2018-05-30_17h53_35

 

Sourcetreeを開く

上部タブの「Create」もしくは 上部メニューの「ファイル」>「新規/クローンを作成する」を選択

2018-05-30_17h55_25

作ったフォルダを選択、てきとーに名前を入れて「作成」

2018-05-30_18h02_25

 

先にフォルダを作った場合はメッセージが表示されるので、「はい」を選ぶ
2018-05-30_18h04_07

Gitのリポジトリができました

2018-05-30_18h05_27

ファイルの履歴をとってみる

ファイルを作る

こんなファイルを作ってみました

てきとー.txt

 
こんにちは、世界  

そうすると追加したファイルが反映されます(反映されない場合はF5キーとかで更新)
2018-05-30_18h13_44

「作業ツリーのファイル」と書かれた部分にファイルが入りました
ここには更新されたファイルが記載されます
「?」アイコンで表示されているファイルが未登録のファイルになります
この状態ではまだコミットは出来ません。

「全てインデックスに追加」を押してみます
2018-05-30_18h19_51

「Indexにステージしたファイル」 と書かれた部分ファイルが移動しました
この部分はコミット予定のものが記載されます
緑色の「+」アイコンで不表示されているファイルが新しく登録するファイルになります

Gitで「コミット」とは「リポジトリに反映する」という意味で使われます

上記画像の右側の緑色の部分が新しく追加になった部分です

コミットしてみる

コミットの際にはメッセージの記入が必須です。
「コミット」 ボタンの上部にテキストエリアがありますが、
ここに何の変更かのメッセージを記載します
2018-05-30_18h30_13

メッセージが書けたら「コミット」ボタンを押します
2018-05-30_18h34_01

正常にコミットが出来ると上記のような、ファイル追加前の画面になったと思います
下部のタブメニューの「ログ」をクリックすると履歴が表示されます
2018-05-30_18h35_01

この画面では今までコミットした履歴が表示されます

ファイルを変更してみる

最初に作ったファイル「てきとー.txt」に追記をしてみます

てきとー.txt

 
こんにちは、Git

 

新しいファイルも作ってみます

新しいやつ.txt

 
あたらしいぞ

 

下部タブメニューの「ファイルステータス」をクリックし、最初の画面に戻ります。
2018-05-30_18h55_32

変更されたファイルが黄色の「・・・」マーク、
新し追加したファイルが先ほどと同じく紫の「?」マークで表示されました。

てきとー.txt のみコミットしてみます
てきとー.txt の行を選択して、「選択をインデックスに追加」をクリックします。
2018-05-30_19h02_14
2018-05-30_19h02_51

選択した「てきとー.txt」のみステージに入りました
この状態でメッセージを入れてコミットしてみます。
2018-05-30_19h04_34

ステージに入れなかった「新しいやつ.txt」 はそのまま残りました
ログを見てみます
2018-05-30_19h04_59

「テキトーな変更をしました」 に先ほど行った修正が記載されています
2018-05-30_19h07_53

赤背景が削除した部分、緑背景が追加した部分になります
行ごとに履歴をとるのでこんな感じになります

新しいやつ.txt も追加してみます
2018-05-30_19h20_46
2018-05-30_19h21_41

ファイルが追加されたみたいです

色々更新してみます
2018-05-30_19h59_15

てきとー.txt の更新、新しいやつ.txtの削除、NEKO.png の追加をしました
NEKO

テキストファイル以外にも画像やExcelファイルなども管理できます

2018-05-30_20h01_41
2018-05-30_20h02_11

過去に戻してみる

現在フォルダの中身がこんな感じになっていると思います
2018-05-31_10h35_07

戻したい履歴をダブルクリックすると、その時の状態に戻せます

2018-05-31_10h39_28
こんな画面が出た場合、「OK」をクリックすると以前の状態に戻ります。
「クリーン」のチェックを入れて「OK」をクリックすると、現在編集中のファイルなどもすべて破棄され、
以前の状態に戻ります。

「てきとな変更をしました」に戻したらこんな感じになりました
2018-05-31_10h37_59

Backlogにリポジトリを作って管理する

まずはリポジトリをプロジェクトを選択します
BacklogやGitHubなどにリポジトリを作ることで他の人も履歴を見たり、作業したりできるようになります。
2018-05-30_20h05_56

左のメニューの「プロジェクト設定」>「Git」でリポジトリを作成します。
2018-05-30_20h10_32
こんな画面が出るので「このプロジェクトでGitを使う」をクリックします

これでGitが利用できるようになりました
2018-05-30_20h11_39

「リポジトリを追加する」をクリックしてリポジトリを作成します。

2018-05-30_20h13_52
必要な情報を入力したら「リポジトリを作成する」をクリックすると作成終了です
リポジトリ名、説明は分かりやすいものを入れると良いです

WebフックURL は外部のサービスと連携する場合に入力するので、未入力で問題無いです。

こんな感じに出来上がりました
2018-05-30_20h16_35

ここに記載されているURLをコピーして取っておきます
[https://densuke.backlog.jp/git/DNSK/test-blog.git]
このURLがリポジトリのURLになります

SourceTreeの画面に戻り
上部メニューの「リポジトリ」>「リポジトリ設定」をクリックするとリモート側のリポジトリ設定ができます
ここに先ほどのリポジトリURLを入力します
「デフォルトリモート」にチェックを入れ、ユーザー名にはバックログにログインする際のユーザー名を入力します
以下のような感じです
2018-05-30_20h28_26
「OK」 を押すと設定終了です

リポジトリの設定が終わったら「プッシュ」をします
メニューの「プッシュ」をクリックすると以下の画面になります
2018-05-30_20h29_12
「master」のところにチェックを入れ、「プッシュ」をクリックすると
BacklogのGitリポジトリに保存できます

ユーザー名とパスワードを求められたらBacklogにログインする際のユーザー名とパスワードを入力します
2018-05-30_20h32_11

エラーが出なければプッシュ終了です
Soucetreeのサイドバーに「リモート」>「origin」が増えてます
2018-05-30_20h34_08

Backlogのリポジトリに反映されました
2018-05-30_20h37_32

2018-05-30_20h34_20

 

以上です

結構長くなりましたが、全然説明できていないので気が向いたらまた記事書きます。

このエントリーをはてなブックマークに追加
LINEで送る