>SourceTree導入でソースコードの変更履歴管理がラクチン便利!2014年8月26日PostSharePocketHatena今まではとても原始的な方法で管理してたたとえばWordPressでテンプレートファイルを変更したり、ブログのHTMLソースコードを変更した時、「どこを、どんな風に変更したか」という管理をしてらっしゃいますか?そんなのしてないよー、って人もいるかと思いますが、私はやってます。「あれ?どこ変更したんだっけ?」と忘れっぽい性格なのもあるし、カスタマイズしながら混乱して元に戻したくなったけどバックアップ取ってなかったから戻せなくなったわーい、と泣きを見た経験も多々あったんです。以前はHTMLやPHPのソースを変更した際、変更箇所や変更内容をソースコード内に直接書いてました。機能を変更したけど以前のソースも残しておきたい場合は「コメントアウト」と言って、残したい場所をコメント化することでブラウザ表示時には実行されずソース自体を残すことが出来ます。追加やコメントアウトした場所に簡単な変更内容と日付も書いてました。この方法だとソースコードを見れば履歴が分かるんですけど、カスタマイズを何度も何度も続けていくとソースコード自体がめちゃくちゃ汚くなります。消したくないから、って理由で過去の(=今は不要な)コードが沢山残っていくから視認性が悪い。このブログを始めて途中からやり始めたのは、WordPressテンプレートファイルを変更する前に、ファイル自体をコピー&ペーストし、変更する日付をファイル名にくっつけて別名保存するという方法。「style.css」というファイルを8月26日にカスタマイズする場合は、ファイルをコピペし、ファイル名を「140826style.css」とリネームして、バックアップ専用フォルダに別名保存してから本体をカスタマイズ。変更内容はEvernoteの専用ノートにカスタマイズ内容を書き残してました。この「別ファイルでバックアップ&Evernoteに変更内容を記録する複合技」の管理技で特に不便なく1年以上やってたんですけど、もっと簡単で便利な方法がありました。それが今回紹介する「SourceTree」というツール。ごりゅご.comごりゅごさんのエントリーを読み、「これイイ!うちも導入しよう!」と思い立ったものの、WordPress自体をカスタマイズする機会がほとんどなかった。7月途中から別サイトの新規開発に着手しまして、このタイミングでようやくSourceTreeを導入。使い始めて感じるのは、ほんっと、ラクチン&便利です。今まではファイルを別名保存して、変更内容をEvernoteに記録する方法でしたが、その両方をSourceTreeの中でまとめて出来るし、今までの変更履歴も残ってるから昔のソースコードもすぐ確認できます。以前のソースに戻したくなった場合もSourceTreeですぐ復元できるんですって。私はまだやったことないけど。私自身「Git」に関して無知ですが、Gitに詳しくない方々でも簡単に使えるし、無料ツールってのも素晴らしい。SourceTree上記サイトからSourceTreeをインストールできます。Windows版もMac版もあります。インストールしてから最初の登録まではごりゅごさんのエントリーで解説されているのとほぼ同じでした(画面内容が少し変わってたくらいです)。3つくらいの関連サービスに登録してね、みたいな画面が表示されますが、ここは無視して(=何も登録しないで)OKでした。SourceTreeを起動し、まずは「リポジトリ」というものを新規登録する必要があります。左上にあるアイコンをクリック。新規登録画面は、初期表示だと「リポジトリをクローン」になってます。私は最初こっちで新規登録してしまい、全然違う状態になってハマりまくりました。上にある3つのアイコンのうち右端の「リポジトリを作成」をクリックし、リポジトリのタイプは「Git」、バージョン管理したいフォルダを「リポジトリ保存先」に指定し、自分で分かりやすい名前を「ブックマーク名」に入力して、作成ボタンをクリック。追加されたリポジトリ(上の例だと「テストテスト」)をダブルクリックするとバージョン管理画面に移動します。最初のインストール時に登録を促される幾つかの関連サービスは後で登録することも出来るそうです。それとは別に、SourceTreeの利用を始めてしばらくすると「現在は試用期間だから無料登録してね」みたいな英文メッセージが起動する度に表示されるようになります。これは上記の関連サービスと違ってSourceTree自身の無料登録のようなので、指示に従ってメールアドレスを登録すれば、以後メッセージは表示されなくなります。これがメイン画面なんですけど、画像ちっちゃくて分からないですよね。基本的には「作業ツリーのファイル」という欄に、新規追加あるいは修正を加えたファイルが一覧で表示されてます。これを「コミット」することでバージョン履歴を管理していく方法。1度もコミットしてないファイルには、ファイル名の左側にクエスチョンマークの青いアイコンが表示されてます。試しに、test1.phpというファイルをコミットしてみます。「作業ツリーのファイル」に表示されているファイルのうち、コミットしたいものの左端にあるチェックボックスにチェックを入れると、「Indexにステージしたファイル」という欄に対象ファイルが移動します。この段階ではまだコミット完了していません。右側にはソースコードの内容が表示されてるんですけど、中身は今回コミットしようとしているtest1.phpではなく、「作業ツリーのファイル」の一番上にあるtest2.phpの中身ですのでお間違えなく。これ、最初のうちは混乱して「なんで?」となったんですけど、チェックして上に移動させると、ソースの表示対象はコミット候補(=test1.php)ではなくて、作業ツリーの先頭(=test2.php)に変わっちゃう仕様だからみたいです。コミット対象のファイルの中身を見たい場合は、そのファイルをクリックしてあげると右側のソースコード表示が変わります。次で説明しますが、コミットするときはコメントを必ず書くという仕様なので、ソースの中身を見ないと何てコメント書けばいいか分からん、という場面も出てきます。コミット対象の中身を見る方法は覚えておくべし。違うファイル見てても意味ないですからね。画面下側にコメント入力欄があります。自分で分かるように何かコメントを入力したら、右下の「コミット」ボタンをクリック。該当ソース「test1.php」の現時点でのバージョンがコメント付きで登録されました。test2からtest4まで、残り3つのファイルがコミットされてませんよね。左サイドバーの「作業コピー」欄には、まだコミットされてないファイルが残ってると数字付きで表示されます。Changes」と表示されます。Changes」ってところをクリックするか、左サイドバーの「作業コピー」をクリックすると、コミットするファイルの選択画面に戻ります。Changes」をクリックして画面移動すると、コミット用のコメント欄が表示されません。そんな時は画面上に並んでるアイコン群の左側にある「コミット」をクリックするか、左サイドバーの「作業コピー」をクリックすれば、コメント入力できる画面になります。1つ1つのファイルに1個ずつコメントつけてコミットするなんて面倒くせえよ〜、って場合は複数ファイルをまとめて1回でコミットすることもできます。これで全てのファイルがコミットされました。ファイルを変更・修正した時もやることは全く同じです。試しに、4つあるファイルのうち「test2.php」を修正してみました。変更したファイルも「作業ツリーのファイル」欄に表示されます。新規ファイルの時と違うのは、ファイル名の左にあるアイコンが青ではなく黄色になってます。チェックボックスにチェックを入れ、コメントを入力し、コミット。この操作の流れは前述した通り。右側にはソースの変更内容も分かりやすく表示されます。赤い部分が修正前の古いコードで、現在はもう存在しない行。緑の部分が新たに追加した行(修正した行)です。変更内容を簡単にコメントで残して、コミットして完了。変更内容は履歴としてずっと残りますので、どの時点でどんな変更をしたか、後で見直すこともできますし、以前の状態に戻すこともできます。1つのツール内でこれら全てが完結してしまうので、すっごくラクチン。)的まとめきめ細やかに履歴管理したい人は、1つ1つのコミット時に変更の詳細をコメントで残すことで分かりやすいバージョン管理が可能になります。面倒なのがイヤな人は、何か適当なコメントを短く入力して、その日に修正したファイルをまとめて1回でコミットするだけでもバックアップが取れることになります。あれば、このSourceTreeで十分過ぎると感じてます。今まで手間をかけてたから、SourceTreeの便利さが実感でき、とてもラクチンになりました。無料で使えるのも素晴らしい。現在開発中の新サイトがある程度形になってきたら、次は「りくまろぐ」のWordPress新テーマを作る予定なのですが、その際には当ブログもSourceTreeのバージョン管理に完全移行させます。カスタマイズをよくするけど、以前のソースコードも残しておきたいんだよなーってブロガーさん、SourceTreeを使うとラクチンですよー。PostSharePocketHatena-Webサービス-Webサービスブログカスタマイズauthor似たテーマの関連記事Cacooを使って初めてワイヤーフレームを作ってみた新しいブログデザインのイメージを整理するため、ワイヤーフレームの作成を決意。Webサービス「Cacoo」を利用したのですが、これがとても便利でした。ブレインストーミングツール「lino」で頭の中を整理するマインドマップと共に思考整理手法として有名なブレインストーミング。頭の中にあるアイデアを付箋に書き出しボードに貼ることで視覚的に整理する手法ですが、これをPC/iPhone/iPadでデータ共有して作成できる便利なツールが「lino」です。Amazon商品画像はURLを少し変えるだけで画像加工ができるAmazon.co.jpで販売されている商品のリンクを作成する時などに、指定されている画像のURLにパラメータを追加することで様々な加工が可能になります。delaymania大谷さんにボタンを作って頂きました関東在住のブロガー、大谷大さんにiPhoneアプリや音楽ダウンロード用のボタンを作って頂きました。ボタンをブックマークレットに反映させると共に、ベースカラーを見直しブログ全体の色調を整理してみました。Evernoteプレミアムパック3年版、現在はどこで買えるのかEvernoteの有料プラン「プレミアム」を年額よりも安く購入できる割引きプラン「プレミアムパック」。その中で最も割引率が高い「3年版」は、以前はAmazonで販売されていたものの現在は取り扱われていません。現在どこで買えるのかを調べてみました。Evernoteプレミアムパック3年版は有料プラン利用者にとっての最適解2016年6月末、Evernoteが無料プランの条件変更と有料プランの価格改定を発表。有料プランを利用しているユーザーであれば、プレミアムパック3年版を購入して安くお得にプレミアム期間を更新することをオススメします。IT企業のシステムエンジニア、現在はフリーランスのエンジニア・ライター。記事執筆、WordPressを使用した業務システム・各種ツール開発、サイト運営などをおこなっています。当ブログでは地元・北九州を始め福岡県各地を散策した記録や風景写真の紹介を中心に、Webツール、福岡グルメ、ビートルズなど様々な好きなものについて発信しています。福岡県北九州市で有名な神社を各区別に紹介しています。お正月の初詣・三社参りの参考にして頂ければ幸いです。ランキングまとめ様々な野菜の日本国内における生産量・収穫量の順位はどうなっているか、日本一はどこなのか、2021年現在の都道府県ランキングをまとめてみました。3Evernote有料プラン値上げによる分岐点:継続か解約か2023年5月に有料プランの再値上げが発表されたEvernote。利用者は継続利用かプラン解約かの分岐点に差し掛かっていると思います。今後も利用を継続したほうが良い人、今回を機に有料プランを解約した方が良い人、それぞれについて判断材料をまとめました。ランキングまとめ様々な果物の日本国内における生産量・収穫量の順位、どこが日本一なのかについて2021年現在の都道府県別ランキングをまとめてみました。5えきマチ1丁目折尾、少し分かりづらい専用駐車場の場所と行き方2023年9月29日にオープンした、折尾駅高架下の新商業施設「えきマチ1丁目折尾」。オープンの数日後に初訪問し、写真を撮ってきました。専用駐車場の場所や行き方が分かりづらいので、そちらも写真付きで解説しています。スペースワールドを見下ろせる高台に建っていたホテル「アクティブリゾーツ福岡八幡」。2022年9月末で閉館し、その後解体されたホテル跡地が現在どうなっているのか、現地に行って写真を撮ってきました。入居しているクロサキメイトは2020年4月末で閉店することが発表されました。黒崎エリアの過去を振り返ると共に、閉店が間近に迫ったJR黒崎駅前の店舗周辺を散策して写真を撮ってきました。8【2024年版】北九州ラーメンのおすすめ名店、ここで食べれば間違いナシ!福岡グルメで代表的な物の一つが「豚骨ラーメン」。私の住む北九州市にも美味しいラーメンを提供してくれる名店が多数あります。県外出身ながら北九州市に移住して30年を超えた私が、これまで食べ歩いてきたラーメン店の中でも特にオススメな店舗を紹介します。9イオンカードのポイント移行を忘れ、旧カードを破棄した場合の救済策ポイント一体型クレジットカードの場合、カード更新時期にはポイントの移行が必要です。私はイオンカードセレクトを初めて更新する際、ポイント移行をせずに旧カードを裁断・破棄するという大失敗を犯しました。この記事では旧カードを破棄した場合の救済策を紹介します。まで使用していたWindowsの年賀状作成ソフト「筆まめ」にある複数の住所録データを「宛名職人」に移行する方法を紹介します。