前置き

個人開発でもチーム開発でも、Gitは開発者にとって、ほぼ必要不可欠なツールです。

僕も当然Gitを使っていますが、コミット時のメッセージを書くときにどう書いていいかわからなくて、毎回頭を抱えてしまいます。

そこでジェネレーターを作ることにしました。

出来上がったもの

Git Commenter

Gitのコミットメッセージについて

僕が調べたところGitのコミットメッセージには、統一された書き方は存在しませんでしたが

メッセージ自体の可読性、コミット内容のわかりやすさや、Gitの仕様を考慮して

コミット内容の要約 // 英語では V + O (+M) と書くのが一般的

コミット内容の具体的な理由

という書き方が一般的でした。

また、ここ最近ではコミット内容の把握を簡単にしたりlogやGithubのレポジトリがオシャレになるという理由で、コミット内容のカテゴリを表現する絵文字をコミット内容の要約にprefixとしてつけるのが流行っているようです。(Qiitaにもいくつか絵文字コミットについて言及している記事があります)

このジェネレーターでは、絵文字もサポートして

絵文字 : コミット内容の要約

コミット内容の具体的な理由

という形式のコミットメッセージを生成するようにしました。(もちろん絵文字もない、コミット内容の具体的な理由もない要約だけのコミットメッセージもここでは作れます)

要約については、Githubのファイル欄に表示されたりするためここは日本語英語が入り混じっていると汚いなと思ったので英語統一にしました

コミット内容の具体的な理由については英語が望ましいですが、

• 具体的な理由を書く必要がある (要約より、英語力が必要であり内容が様々であるためテンプレートもあまり機能しない)
• Githubのファイル欄や、git log --onelineコマンドで表示されない

以上の理由から日本語でも問題ないのかなと思います。

具体的な使い方

基本的には上記のgifのように実際に使っていただければわかると思います。

まずフォームについて簡単に説明すると

• Emoji: コミットカテゴリを絵文字で表したもの
• Verb: コミットの具体的な操作内容 (例: 何かを追加した => Add、何かを更新した => Update)
• Adjective: コミットの対象を修飾するもの (例: 不必要な => unneeded)
• Object: コミットの対象 (例: README.mdを更新した => (Update) README.md)
• Modifier: コミット文を修飾するもの (例: sample.txtをAからBに移動した => (Move sample.txt) from A to B)
• Reason: コミット内容の具体的な理由
• Git Comment: 入力から生成されたコミットメッセージが入ります

テンプレート

各フォームの左のセレクトボックスで「テンプレ」を選択すると、コミットメッセージでよく使われる英単語のテンプレート一覧、およびその日本語訳が一覧で出てきます。

テンプレの英単語は簡単なものが多く、コミットメッセージ中でよく使われているため、テンプレの英単語でコミット内容を表せる場合は、これらを使ったメッセージのほうが読みやすいメッセージになると思います。参考にしたQiita記事

また、デフォルトのテンプレート以外に個人がよく使う単語やフレーズは、ユーザーテンプレートとして登録することができます。

登録した単語やフレーズはフォームのテンプレ一覧に表示されるようになります。

開発

このWebアプリ自体は、react(+redux)を使って開発しました。 クライアント制作ではよく使うので特に苦労することなくすんなりできました。
(しいて言えば、クリップボードへのコピーがReactの仮想DOMだと難しいです。結局専用のライブラリを使いました。)

当初はWebアプリにするつもりはなかったのですが、必ずGUIを持たせたいとは考えていました。

ただWebアプリ開発以外でGUI開発の経験が特になく、Webアプリでも特に問題はないのでWebアプリにしました。

デプロイに関しては、いつもGithub Pagesにホスティングしていたのですが、勉強もかねて今回はS3にデプロイしました。(しかもRoute53で独自ドメインまで無駄に取りました。)

補足

このWebアプリ開発の前準備のときに調べていて初めて知ったのですが、Gitにはtemplate機能があります。(こちらのQiita記事とかに詳しく載っています)

ですが、僕が普段使っているVSCodeのGitツールではこのテンプレート機能が利用できず、ターミナルをぽちぽちしたり、自分でわかりづらいコミットメッセージを考えたりしなくてはいけなかったため、今回このようなWebアプリをつくりました。

感想

しっかりGoogleで調べましたがGitについてはあまり理解しているとはいえないので、間違っているところやこの機能使えばもっと便利でいいよってところがあったら教えてくださると助かります。

利用した感想とかもあると嬉しいです。

はじめに

GitHubからさくらのレンタルサーバーに自動デプロイしたいな、と思って調べたら記事が何個かあった。しかし少し変わった部分があったので再まとめ的な感じ。
参考記事は最後に貼っておく。

gitの導入

SSHログイン

ssh アカウント名@アカウントのドメイン.sakura.ne.jp

Bashに変更

bash

curl-develのインストール

こいつが無いと、httpsでのcloneができなかった。

curl Downloadより。
ここでは7.64.0

作業ディレクトリは$HOME/local/src。インストール先は$HOME/local。

mkdir -p $HOME/local/src
cd $HOME/local/src
wget https://curl.haxx.se/download/curl-7.64.0.tar.gz
$ tar zxvf curl-7.64.0.tar.gz
$ cd curl-7.64.0.
$ ./configure -prefix=$HOME/local
$ make
$ make install

gitのインストール

まずGoogle Code Archive git-coreにてgitのソースコードの確認。ここでは1.9.0を使用する。

./configureにオプションを少々追加する。

cd $HOME/local/src
wget https://storage.googleapis.com/google-code-archive-downloads/v2/code.google.com/git-core/git-1.9.0.tar.gz
tar zxvf git-1.9.0.tar.gz
cd git-1.9.0
./configure -prefix=$HOME/local -with-curl=$HOME/local --enable-pthreads=-pthread
gmake all
gmake install

パスの追加

別のディレクトリにインストールしたらスルー。

cd ~/
vim .shrc

pathに追記。

set path = (/sbin /bin /usr/sbin /usr/bin /usr/games /usr/local/sbin /usr/local/bin /usr/X11R6/bin $HOME/local/bin $HOME/bin )

GitHubからcloneする

cloneするディレクトリは$HOME/www/test/

cd ~/www/test
git clone https://github.com/*******/*******.git

デプロイ用php作成

masterブランチをpullする場合。

deploy.php

<?
exec('git -C /home/アカウント名/www/test pull origin master', $op);
echo "<pre>";
var_dump($op);
echo "</pre>";
?>

webhook設定

GitHubのリポジトリ設定にて
URLに作成したphpファイルのURLを指定。

trigger設定

今回はReleasesのみにチェックを入れた。
みなさんのお好みで。

ここにも書いてあるけど、セキュリティには気をつけなければ…

参考

• 【超簡易的】githubにpushで、さくらサーバーに自動デプロイ
• さくらインターネットのレンタルサーバに git のリモートリポジトリを作成する
• さくらのレンタルサーバにgitを入れる : pthread_create 云々
• レンタルサーバでgitを使う（その2）「fatal: Unable to find remote helper for ‘https’」の解決

デフォルトブランチとは？

GitHub や Bitbucket ではリポジトリの設定画面からデフォルトブランチを設定できます。デフォルトブランチの呼ばれ方はサービスや文脈によっても異なり「メインブランチ」「ベースブランチ」などと呼ばれることもあります。

デフォルトブランチの設定は、主に以下の場面で使われます。

• git clone した時に最初にチェックアウトされるブランチ
• ブラウザでリポジトリを見た時に最初に表示されるブランチ
• プルリクエスト作成時の標準のマージ先ブランチ

何も設定しないと master に設定されていますが、そのリポジトリのベース開発ブランチを設定しておくと何かと便利です。

デフォルトブランチ名を取得するコマンド

以下のコマンドで取得できます。git の便利ワンライナーを作るときの部品などにどうぞ。

「origin/master」のフォーマットで取得する場合:

git symbolic-ref --short refs/remotes/origin/HEAD

「master」のフォーマットで取得する場合:

git symbolic-ref refs/remotes/origin/HEAD | awk -F'[/]' '{print $NF}'

ワンライナーの awk はスラッシュ区切りにした上で最後のフィールドだけを出力しています。

まさか「みんなで逮捕されようプロジェクト」でGitを覚える羽目になろうとは。

リポジトリをローカルに複製すること（clone）と、ローカルリポジトリの変更をリモートリポジトリへ反映すること（push）以外はSubversionとだいたい一緒。

リポジトリの複製

$ git clone https://github.com/cress-cc/lets-get-arrested.git

ローカルにlets-get-arrested というディレクトリが作成される。以降の作業はここで行う。

$ cd lets-get-arrested

ブランチ作成

既にあるブランチの確認

$ git branch -a

作業ブランチ切り替え

masterをもとにブランチを作成するので、masterに切り替える。

ちなみに、GitHubでgh-pagesというブランチを作成すると、 https://cress-cc.github.io/lets-get-arrested ¹のような形式のURLでアクセスできるようになる。

$ git checkout master

新規ブランチ作成

$ git checkout -b gh-pages

リモートリポジトリへ反映

$ git push -u origin gh-pages

ローカル変更の反映

アカウント設定

いきなりコミットしようとしたら「誰だオメー」って怒られてしまったので、氏名とメールアドレスを設定。

$ git config --global user.email "*****@cress.cc"
$ git config --global user.name "Cress"

ローカルリポジトリへのコミット

$ git commit -m "First commit."

リモートリポジトリへ反映

$ git push -u origin gh-pages

---

1. 中身は昨今問題となっている無限ループのJavaScriptなので、うっかり開いてしまっても警察に通報したりしないでくださいね。 ↩

状況

本番環境へのデプロイを控えていた時に、ブランチ間の差分を確認したいと思い調べてみました。

方法

以下の要領でURLを叩けばOKです。

• リポジトリURL/compare/比較元ブランチ名...比較先ブランチ名

【例】 新たに作成したkobushideブランチとmasterブランチの差分を比較したい
https://github.com/tokkun_ride/sample_repository/compare/master...kobushide

ポイントは次の２つの記載です

• /compare/
• ...

参考記事

github でブランチ・commit間の diff を見る

GITフォルダで書きのコマンドを実行
git fetch --all
git reset --hard origin/master
git pull

--autosquashオプションつけ忘れ？

$ git rebase -i --autosquash HEAD~[コミット数]

忘れがちなので覚えておく。

追記

下記コマンドでconfigを設定すると、--autosquashを勝手にしてくれるとコメント欄で教えて頂きました！

$ git config --global rebase.autoSquash true