ホーム

CLOUDSEED BLOG

矢印

システム開発

矢印

コマンドを使わずにGitを使えるSoucetreeについて

時計

コマンドを使わずにGitを使えるSoucetreeについて

コマンドを使わずにGitを使えるSoucetreeについて

目次

はじめに

今回はGitをコマンドを使わずに視覚的にわかりやすく使用することができるSoucetreeについて解説します。

記事の対象者として想定しているのは、Gitを使ってみたいけど昨日の複雑さで挫折したことがある人やコマンド入力や専門用語など覚えることが多すぎて挫折したことがある人です。

この記事ではGitやSoucetreeに関しても基本的な内容のみに絞って解説します。この記事の目的は、個人利用でも一番私用することが多くなる多重バックアップ機能がSoucetree上でできる様にすることです。


Gitについて

Gitとは、誤解を恐れずにいうとファイルの変更履歴をメモつきで保存をするためのプログラムです。主にプログラムを作成したりするコーダーが自分の書いたコードを保存・管理する目的で使われます。はじめにGitの機能について簡単にさらっておきます。

Gitは主に3つの機能に分けて理解すれば理解しやすいと思います。

1つ目の機能が多重バックアップ機能です。具体的にはAをコーディングできたらメモをつけて保存、Bをコーディングできたらメモをつけて保存というように、繰り返しメモを書きながら何回も何回も保存することで、後でミスが見つかった時に過去に保存したどの内容にも戻すことができます。Gitの一番基本的でよく使う機能です。この記事ではここができるまでを今回の目標にしています。

2つ目の機能が共有機能です。具体的には自分がコーディングしたファイルを多重バックアップごと他の人に共有することができます。これによりGit管理のファイルを受け取った他の人は、先に作業した人がどのようにプログラムを書いていたか、現在までの修正の流れなどを全て把握して残りの作業を進めることができます。

3つ目が機能の枝分かれと統合機能です。コーディングをしていると「一旦これで完成なんだけど、もっと簡単な書き方で書き直せそうだな」と感じる時があります。その際にこの機能を使用します。完成版Aを念の為Gitで保存してから、多重バックアップの機能でコードを書く前の状態に戻し、そこからさらに枝分かれして別の完成版Bを作成していくことができます。こうすることでGitではいつでも完成版Aと完成版Bを比較・検討できます。

Gitについて


また、枝分かれしたものを再び統合することもできます。例えば、作業途中で枝分かれさせて半分を自分がコーディングして、他の人にもう半分をコーディングをしてもらって再度統合することで作業分担を行うことも可能です。

以上がGitの主な機能です。ただし、最初からすべてを使いこなす必要はありません。少しずつ使える様になってゆきましょう。


導入方法

Gitのインストール方法

Gitの導入に関しては他サイトとの記述も多いので簡潔に記述するにとどめます。

1.Gitのダウンロード

Gitのウェブサイトから、インストーラをダウンロードします。
https://git-scm.com/download/

2.インストール

インストーラを実行します。設定内容についてわからない場合は全てデフォルトで大丈夫です。


Soucetreeのインストール方法

1.Soucetreeのダウンロード

Soucetreeのウェブサイトから、インストーラをダウンロードします。https://www.sourcetreeapp.com/

2.移動したあとBitBucketのアカウント作成を促す画面が表示されますが、入力せず「続行」をクリックします。

「続行」をクリック



4.次のアカウント設定画面も未入力のまま「完了」をクリックします。

未入力のまま「完了」をクリック



5.以下の画面が表示されればインストールは完了です。

インストール完了




使用方法

①監視ディレクトリ(フォルダ)の追加

Gitに監視してもらうために、Soucetree経由でディレクトリ(フォルダ)を指定します。



●下準備

 ”test” というフォルダを作成しておいてください

1.Gitで管理したいフォルダ(今回は空フォルダ “test” )をSoucetreeへドラッグ&ドロップします。

管理したいフォルダ(今回は空フォルダ “test” )をSoucetreeへドラッグ&ドロップ



2.「ローカルリポジトリを作成」という項目が開くので、「作成」をクリックします。

「作成」をクリック



3.Soucetreeで以下の画面になればディレクトリ(フォルダ)の追加は成功です。

ディレクトリ(フォルダ)の追加成功



※なお、test内部にgitが使用する隠しディレクトリが作成されています。これはgitの作成した関連ファイルとなります。誤って削除等はしないようにしましょう!

gitが使用する隠しディレクトリ




②コミット(保存方法)

バックアップを一つ作成することをコミットといいます。コミットざっくりいうと履歴とメモのついたセーブ機能です。PCで定期的に複数バックアップを作成したり、ゲームで進捗に応じて複数セーブデータを作成したりするのとよく似ています。具体的には作業Aが終わったらコミット、作業Bが終わったらコミット、というような形で使用します。この項目でのコミットの説明は一番シンプルなコミットの使い方のみを説明したものです。

1.Soucetreeで表示されている①で作成したフォルダをダブルクリックしてください。

作成したフォルダをダブルクリック



2.以下の新しいウィンドウが開きます、現在は変更点がありませんので何も表示されません。

新しいウィンドウが開く



3.この状態で “test” フォルダの中にエディタ等で “test.txt” を作成し、内容を「テストです。」と記述してください

“test.txt” を作成



4.Soucetreeの画面に戻ると、Soucetreeが “test” フォルダ内の ”test.txt” の変更を検知しているのが確認できます。

新しく追加した内容や変更を行った内容はこのようにSoucetree画面左に表示されます。

新しく追加した内容や変更を行った内容は画面左に表示される



6.下図のアイコンをクリックし、「ステージングを分割して表示」をクリックします。

「ステージングを分割して表示」をクリック



7.Soucetreeの左半分の表示が以下のように上下に分割されます。下は先ほどと同じGitが認識した新しい追加・変更部分を示す領域で、上はステージングというコミット(保存)したいファイルを指定する領域です。

左半分の表示が以下のように上下に分割される



8. “test.txt” をステージングへドラッグ&ドロップし、コミットメッセージを書き込み、「コミット」をクリックまたはショートカット “cmd + enter” を入力します。

※コミットメッセージは必ず書く必要があり、“試験的に作成” などコミットした内容や理由を記入します。

コミットメッセージを書き込み、「コミット」をクリック



9.以下のような画面になれば成功です。

コミット成功



10. “test” フォルダ内でさまざまな変更を加えてコミットしてみてください!

コミットのテスト

コミットのテスト



③過去のコミットの変更点を見る・復元する

・過去のコミットの変更点をみる

過去のコミットを見る際はみたいコミットをクリックしてください。右下にコードの変更箇所が一覧で表示されます。

赤で書かれているのが削除されたコード、緑で描かれているのが追加されたコードです。

過去のコミットの変更点をみる



・過去のコミットの状態を復元する

復元するには復元したいコミットをダブルクリックしてください。以下の様な画面が表示されるので「OK」をクリックします。

過去のコミットの状態を復元する

実際にファイルを開き直してみて、過去の状態に戻っていれば成功です。




③変更の取り消し(チェックアウト、リセット)

Gitではコミットを利用して変更前の状態にフォルダを戻すことができますが、戻す対象によって呼び方と操作が異なります。

チェックアウト: 一番最新の変更をリセットする

リセット: コミットしてしまっている変更をリセットする



●下準備

この例での変更履歴は以下のような状態からフォルダを復元していきます。片方はコミット前、もう片方はすでにコミットしてしまった状態です。

下準備




●一番最新の変更をリセットしたい場合(チェックアウト):

1.「ファイルステージング」をクリックし、修正したい変更を右クリック、「リセット」をクリックします

「ファイルステージング」をクリックし、修正したい変更を右クリック、「リセット」をクリック



2.「OK」をクリックします

「OK」をクリック



3.「Uncommitted changes」が消えていれば成功です

「Uncommitted changes」が消えていれば成功




●コミットしてしまっている変更をリセットする場合(リセット):

※リセットのキャンセルはできません、十分注意して実行してください

1.「master」をクリックし、戻りたいコミットを右クリック、「masterをこのコミットまで戻す」をクリックします

「masterをこのコミットまで戻す」をクリック



2.モードを「Hard」に指定し、「OK」をクリックします

※今回は説明が煩雑なってしまうのでHardで実行します

モードを「Hard」に指定し、「OK」をクリック



3.「OK」をクリックします

「OK」をクリック

4.指定したコミットまで戻れていたら完了です


まとめ

以上、Soucetreeについての導入でした。

Soucetreeは比較的簡単にGitを使うことができる方法の中でもとっつきやすく、初心者におすすめの方法です。とりあえず記事の内容だけでもできてしまえば、十分便利なものとして使うことができますし、使っていくうちにわかってくることも多いと思います。

ぜひ、この機会にSoucetreeを触ってみてください。

Webサイト作成でお困りの企業様がいたら

Webサイト作成について「どんなWebサイトを作ったらいいかわからない」「Webサイト制作をお願いしたいけれど、どこに依頼したらいいか困っている」という企業様がいらっしゃいましたら、ぜひ、株式会社クラウドシードにお任せください。

クラウドシードではWebサイト制作に加え、Webサイトの維持管理、運用に関するコンサルティングも請け負っております。Web制作会社ならではのノウハウや知見を活かし、お力添えさせていただきます。

クラウドシードはお客様の課題やご要望に合わせたプランを提案します。ご相談・お見積もりは無料で承っておりますので、以下よりお気軽にお問い合わせください。


クラウドシードお問い合わせ

CONNECTION

POPULARITY

Figmaで作る&使える~簡単なパターンの作り方~のコピー
時計

2023/02/02

Figmaで作る&使える~簡単なパターンの作り方~

ORIGINAL SERVICE