【Sourcetree】バージョン管理の基本手順【GitHub】
本記事では、バージョン管理の基本である「コミット」と過去の状態に戻す手順を説明します。
個人開発であれば、コミットと作業を戻す手順だけ押さえておくだけで、プログラミングがかなり捗るようになります。
環境
- Git
- GitHub
- Sourcetree 3.4.2
以下の記事の手順でローカルリポジトリとリモートリポジトリを作成済みの状態から説明いたします。
「コミット」の手順
「コミット」は一作業毎に行います。「コミット」しておくと、後でその時点の状態に戻すことができます。以下、「コミット」の手順を説明します。
管理対象のフォルダに、以下のような「sample.txt」というファイルを追加します。
Sourcetreeを起動し「History」画面を表示すると、以下のように「コミットされていない変更があります」というメッセージが表示されます。
以下の手順でコミットします。
- 「ファイルステータス」画面を表示します。
- 作業ツリーのファイルに変更があったファイルが表示されています。今回は「sample.txt」を選択します。
- 「選択をインデックスに追加」を押下すると、インデックスに追加されます。
- コミットの説明を記述します。
- 「コミット」を押下します。
コミットすると、History画面が以下のようになります。
ここで、sample.txtの内容を少し変更してみます。
Sourcetreeのファイルステータスを見ると、以下の赤枠で囲ったようにファイルの差分が表示されます。
memo
赤枠上の「Hunkをステージへ移動」を押下すると、編集したファイルの一部だけをコミットすることもできます。
コミットすると以下のように樹形図が伸びていきます。
過去の状態に戻す2つの方法
過去の状態に戻すにはいくつかの方法があります。その中で初心者でも使いやすい方法を2つのケースに分けてご紹介いたします。
ケース1：過去の状態に戻すだけ→チェックアウト
過去の状態のファイルを確認したり配布したい場合、チェックアウトを用います。
戻したい時点のコミットを右クリックし、「チェックアウト」をクリックします。
以下のメッセージが表示されますが、気にせず「OK」を押します。
コミットに「HEAD」タグが表示され、ファイルの状態がその時点の状態に戻ります。
試しにsample.txtを開いてみると元の状態に戻っています。
ケース2：ある時点から作業をやり直す→新規ブランチを作成
作業をやり直したい場合は、その時点に新規ブランチを追加するのが良いです。
戻したい時点のコミットを右クリックし、「ブランチ」をクリックします。
以下の画面が表示されますので、ブランチ名を入力し「ブランチを作成」をクリックします。
「rollback」ブランチが表示されます。
sample.txtを確認すると、変更前のファイルに戻っています。
これを以下のように編集します。
Sourcetreeに戻ると、元の「master」ブランチとは枝分かれして「コミットされていない変更があります」と表示されます。
上記で説明した手順でコミットすると、同様に樹形図が伸びていきます。
作業のやり直しが完了したら、ブランチを整備しましょう。
【GitHub】リモートリポジトリを用いてバージョン管理するための初期設定【Sourcetree】
GitHubにリモートレポジトリを作成してバージョン管理する方法を説明します。
前提条件
以下をインストール済み、もしくはアカウント作成済みとします。
- Git
- GitHub
- Sourcetree 3.4.2
方法1：Sourcetreeでリモートリポジトリを作成する方法
Sourcetreeでローカルリポジトリを作成する際に、同時にリモートリポジトリを作成する手順を説明します。
後に説明する方法より、こちらの方が手間が少なくお勧めです。
Sourcetreeでローカルリポジトリとリモートリポジトリを作成する
Sourcetreeを起動し、「Create」をクリックします。
Create a repository画面が表示されたら、以下の手順で入力していきます。
GitHubにアクセスすると、新しいリモートリポジトリが作成されています。
上記画面で青字の「README」をクリックして、README.mdファイルを追加しておくと良いでしょう。
ローカルリポジトリにプルしてリモートリポジトリと同期する
ローカル/リモートリポジトリを作成したら、リモートリポジトリからローカルリポジトリにプルして同期します。
以下の画面にて「プル」をクリックします。
以下の画面が表示されたら、「更新」を押した後にプルするリモートブランチを選択します。選択後、「プル」をクリックします。
Historyを見てみると以下のようにリモートリポジトリの状態が同期されています。
以上で完了です。
方法2：先にGitHubでリモートリポジトリを作成する方法
先にGitHubにリモートリポジトリを作成し、後からSourcetreeにリモートリポジトリを設定する手順を説明します。
GitHubでリモートリポジトリを作成する
GitHubでリモートリポジトリを作成する手順を説明します。
GitHubにアクセスし、下記の「New」ボタンをクリックします。
Create a new repository画面で、リポジトリ名、公開範囲、追加ファイルを入力し、「Create repository」をクリックします。
※リポジトリ名は小文字の単語の間をハイフンでつなぐ”ケバブケース”を用いるのが一般的です。
なお、.gitignoreファイルはここで追加しても良いですし、別途用意しても良いです。
リポジトリ名、公開範囲は作成後でも変更可能です。
リモートリポジトリが作成され、以下のような画面が表示されます。
Sourcetreeでローカルリポジトリを作成する
次にSourcetreeでローカルリポジトリを作成します。
Sourcetreeを起動し、「Create」をクリックします。
以下の画面で、ディレクトリ、リポジトリ名を入力し、「作成」をクリックします。
以下のメッセージが出たら「はい」をクリックします。
以上でローカルリポジトリが作成されます。
リモートリポジトリを設定する
作成したローカルリポジトリに連携するリモートリポジトリを設定します。
ローカルリポジトリを作成後、以下の画面にて「設定」をクリックします。
以下の画面が表示されるので「追加」をクリックします。
リモート名（通常は「origin」）とリモートリポジトリのURLを設定し、「OK」をクリックします。
リモートリポジトリのURLは、以下のようにGitHubにて「Code」をクリックして、四角が重なったボタンをクリックすると、クリップボードにコピーできます。
これを、Sourcetreeの設定欄にペーストします。
以下のようにoriginが追加されているのを確認したら、「OK」をクリックします。
この後、方法1の「ローカルリポジトリにプルしてリモートリポジトリと同期する」の手順を行うことで、リモートリポジトリと同期できます。
以上で完了です。
2021年総括と2022の目標
2022年になりましたので、2021年の総括と2022年の目標を定めたいと思います。
2020年に引き続き、2021年もいろんなことに挑戦しました。
2021年の目標のふり返り
副収入
2021年中に数千円以上のまとまった副収入を得たいと考えていました。副業としては、以下を考えていました。
Webライティングで毎月数千円という収入を達成できたので合格点です。
ゲーム制作
当初は、以下のうちいくつかをできたらと考えていました。
unity1weekでランキングに入れたので一応1つだけ達成。
結局、2021年の前半しかゲーム制作をしませんでした。他にやりたいことがあるので、2022年もゲーム制作はしないかなと思います。
その他プログラミング
当初予定していた取り組みは以下の通り。
web1weekは情報をキャッチできず、気づいたら毎回終了していました。他は達成できたので合格点です。
今後も力を入れて取り組みたいです
2021年のその他の取組み
転職活動
2020年の8月頃まで転職活動をしていましたが、心境の変化もあり4月に再開。5,6月に怒涛の面接ラッシュがありました。結果は全てダメでした…
これまで自分がしてきた仕事は他の会社では活かしにくいんだなあと痛感しました。
それならば「自分で稼げるように頑張ろう」と、副業により力を入れるきっかけになったので、多くの会社と面接できたのは良い機会でした。
レバレッジETF
私はレバレッジETFはスイングでトレードしたい派です。暴落時に投資できる余裕を持っておきたいので。
結果的にはガチホの方が成績が良かったのですが、このスタンスは今後も変えずに行こうと思います。
2022年はテーパリングや利上げも予定されており、近年続いている高いリターンは望めなさそうです。このため、レバレッジETFの比率を下げて守りを固めたいと考えています。
Excel VBA
最近は自分のスキルアップも兼ねて、本業で勉強したことを利用するようにしています。
ただ、クラスとかこれまで使用してこなかったので、Excelを共有するチームのメンバーを困らせてしまいそうなんですよね…
今後はクラウドソーシングで案件を取ることを目標に頑張っていきたいです。
ブログ
2021年は「毎日1行でいいのでブログorコードを書く」というルールを決めました。それ以降、ペースはまちまちですが継続できるようになりました。
「目標を限りなく下げるのが継続のコツ」とひろゆき氏の本に書いてありましたが、その通りでした。
また、まずは記事数を増やそうと思い、ブログの質にもあまりこだわらないようにしました。
今後もゆるく継続していきたいです。
2022年の目標
2021年に多少の副収入を得ることが出来ました。しかし、セミリタイアのためには、さらに大きな収入にしていく必要があります。
そのために、2021年に引き続き以下の副業を継続していきます。
- ブログ
- Webライティング
- プログラミング
ブログ
ブログに関しては2021年に引き続き「毎日1行」を目標にします。
これからも記録したいことをゆるく掲載していけたらと考えています。
Webライティング
副業は案件単価が高いプログラミングにシフトしていけたらと考えていますが、受注できるまで時間がかかりそうです。
それまではWebライティングも継続していきたいです。ひとまずは月に複数案件の受注を目指して頑張っていこうと思います。
プログラミング
目標はプログラミング案件を受注することです。個人的にこれが2022年一番の目標です。
そのためにはブログでプログラミング学習の記録を発信し続けていくことが大事だと考えています。
将来に向けた取り組み
量子プログラミング
以前に記事を書きましたが、量子プログラミングを最近勉強中です。
まだ少し先の技術ではありますが、大きな転換点となる技術だと思うので、そこに自分も関われたらという願望を抱いています。
この先FIREしたら、量子コンピュータの研究がしたいとも考えています。
ジャンク品修理
YouTubeを見ていて面白そうなので、趣味としてやってみたいと思っています。壊れたものを直せると何かと助かるし…
Visual StudioでのC#プログラミング入門【Webスクレイピング】
Webから自動で情報を取ってこれると、何かと捗ります。そこでC#でスクレイピングする方法について調べました。
関連記事
スクレイピングライブラリ
スクレイピングライブラリの種類
C#のスクレイピングライブラリは以下の2つが有名なようです。
- AngleSharp
- Html Agility Pack
色々調べるとAngleSharpの方が使いやすそうだったので、AngleSharpを使用していきます。
AngleSharpのインストール手順
「プロジェクト」→「NuGetパッケージの管理」を選択します。
※新規プロジェクトの作成方法はこちらをご覧ください。
「参照」タブを選択し、検索ボックスに「AngleSharp」を入力すると、AngleSharpが表示されますのでインストールします。
インストールされると、ソリューションエクスプローラーにAngleSharpが表示されます。
スクレイピング手順
AngleSharpを使用したスクレイピングの手順について説明します。
htmlの取得
はじめにhtmlを取得します。以下、サンプルプログラムです。
using AngleSharp; string strUrl = "https://shimazoh.hatenablog.com/entry/cs-vs-howto-basic/"; var config = Configuration.Default.WithDefaultLoader().WithDefaultCookies(); var context = BrowsingContext.New(config); var document = await context.OpenAsync(strUrl); Console.WriteLine(document.ToHtml());
要素の取得
htmlから要素を取得します。例えばタイトルやh2タグを取得する場合は、以下のようなプログラムになります。
using AngleSharp.Html.Parser; var parser = new HtmlParser(); var doc = parser.ParseDocument(strHtml); //上記で取得したhtml Console.WriteLine(doc.Title); //タイトル var h2Nodes = doc.QuerySelectorAll("h2"); //h2タグ foreach(var h2Node in h2Nodes) { Console.WriteLine(h2Node.TextContent); }
その他の要素の取得方法については、こちらのサイトにプロパティ・メソッドがまとめられています。
サンプルプログラム
以上をまとめると、以下のようなプログラムになります。
using AngleSharp; using AngleSharp.Html.Parser; namespace SampleNS { public class Sample { static void Main() { string strUrl = "https://shimazoh.hatenablog.com/entry/cs-vs-howto-basic/"; Task<string> task = fetchStrHtml(strUrl); var parser = new HtmlParser(); var doc = parser.ParseDocument(task.Result); Console.WriteLine(doc.Title); //タイトル var h2Nodes = doc.QuerySelectorAll("h2"); //h2タグ foreach(var h2Node in h2Nodes) { Console.WriteLine(h2Node.TextContent); } } private static async Task<string> fetchStrHtml(string strUrl) { var config = Configuration.Default.WithDefaultLoader().WithDefaultCookies(); var context = BrowsingContext.New(config); var document = await context.OpenAsync(strUrl); return document.ToHtml(); } } }
実行すると以下のようにタイトルとh2タグのテキストが出力されます。
