Tips保管に便利！GitHubと連携できるGistBoxの使い方【2017年でサービス終了】

# 2017年12月 追記
残念なことに、GistBoxが2017年11月末でサービス終了してしまいました・・・。
そこで、新しく開始されたCacherに乗り換えた話をまとめておりますので、よかったら以降はこちらをどうぞ参照してくださいまし。
[GistBoxが2017年11月で終わってしまったのでCacherに乗り換えた話](https://qiita.com/maimax/items/22b91a2104b519b4d05f)

以下、GistBoxの記事も参考までに残しておきます〜〜

# はじめに
新人の頃、覚えることが多すぎて頭から煙が吹き出していた毎日。
少しでも情報整理しようとあらゆるツールを使っていましたが、
ソースコードに関するTipsの保管は、今のところGistBoxが使い勝手良いな〜と思ってるのでシェア。


# Gistとは
ソースコードやテキストなどのTipsをスニペットとしてメモしておけるツールです。
がっつりGitにコミットするようなプロジェクトでなくとも、
断片的にポンポンいれておけるので思いついた実装方法なんかを保管することも可能。

# GistBoxのためのアカウント登録
Gistは、GitHubが提供しているツールです。
利用するには、まずは[GitHub](https://github.com/)のアカウントを登録する必要があります。


### ＊ GitHubの登録
[Sign up](https://github.com/join)画面から、
アカウント名、メールアドレス、パスワードをいれて登録は完了です。

<img width="1125" alt="スクリーンショット 2017-08-14 0.32.30.png" src="https://qiita-image-store.s3.amazonaws.com/0/173732/0f4bbf5f-03a3-239a-692c-18773f88b21a.png">


### ＊ GistBoxの入手
GitHubにアカウントを作ることで使える「Gist」をより使いやすいUIで
便利ツールにしたものが[GistBox](http://www.gistboxapp.com/)です。
Web版であれば、上記URLからGitHubアカウントでログインし、そのまま使えてしまうから超簡単。

さらに、Chromeのアプリとしても追加することが可能なので
普段使いがChromeの人は追加しておくとより便利です。
※[GistBoxのChromeアプリはこちら](https://chrome.google.com/webstore/detail/gistbox/caoihfibgoiiakncomhccbflmlgjaohf?hl=ja)


# GistBoxをChromeで使う
GistBoxは、どのブラウザからでもWeb版の使用ができるほか、
Chromeアプリとして追加も可能と説明しました。
よって、みんな大好きChrome拡張機能もちらほら。

あまり評価が高い拡張機能は少ないものの、、
設定しておくべき拡張機能をひとつご紹介。

### ＊ GistBox Clipper
この拡張機能をいれておけば、Webブラウザで調べ物をしているときに
「へぇ〜」と思ったソースコードなんかをポチっと一発でGistに保存できちゃうんです。
右クリックして、えいやっと「Save as Gist」を選択すれば、そのまま投稿画面が開きます。便利！

<img width="739" alt="スクリーンショット 2017-08-14 0.37.55.png" src="https://qiita-image-store.s3.amazonaws.com/0/173732/2f973f68-ce2f-91d0-8064-4bcfb99f134a.png">


↑こんな感じでソースコードの右上にアイコンが出てくるようになります。
（写真取得元：[JavaDrive](https://www.javadrive.jp/)）
※[GistBox Clipperはこちらから](https://chrome.google.com/webstore/detail/gistbox-clipper/cejmhmbmafamjegaebkjhnckhepgmido?hl=ja)

# GistBoxにTipsを保管する
では、実際に使用事例をご紹介します。
自分の場合は、以下の用途で利用することが多いです。

- 開発中に勘違いしていてハマった実装事例をメモ
- 業務改善に使えそう！と思いついたScriptをメモ
- ネットサーフィン中に見つけた他の人が書いたTipsをメモ
- 便利サイトのURLやページをメモ 

### ＊ ラベルでカテゴリー分け
投稿したGitsには、それぞれラベルを付与することができます。
色分けもできる上、あとから移動するのもドラックでできたり、と簡単です。
<img width="1200" alt="スクリーンショット 2017-08-14 0.42.02.png" src="https://qiita-image-store.s3.amazonaws.com/0/173732/a5a737b0-c9f4-e065-8dd1-ee010c758245.png">


### ＊ 投稿方法
サイドメニューの「New Gist」から投稿します。
拡張子を選択することで、適切なコードスニペットを実装することが可能。
投稿フォームの左下にPUBLICにするかどうか選択するボタンがありますが、
これはあまり意味ないかも。。（詳しくは後述）

あとJavaコードに日本語でコメントいれようとすると
マークダウンがおかしくなるのか文字が勝手に消えてしまったりする。
なので、あくまでもソースコードだけ書く用にしたほうがよい。メモは概要欄に。

<img width="1200" alt="スクリーンショット 2017-08-14 0.51.49.png" src="https://qiita-image-store.s3.amazonaws.com/0/173732/40bc1d2b-b252-1105-e7ec-fdab976b915d.png">




# おわりに
さいごに、悲しきかな注意事項がございます。

### ＊ 注意
Gistに投稿したスニペットは、GitHub上に公開された状態となります。
~~PUBLIC設定をしていなくても、URLさえ知っていれば誰でも見られる環境に。~~
ですので、自分以外にもアクセス権限があることを考慮し、
**個人情報や機密情報のメモには絶対に使わないこと！**

注意を守って、楽しいGistLIFEを送りましょう！


### ＊ お願い
間違えている情報やリンク切れがありましたらどうぞご指摘ください。

### ＊ 参考サイト
- [スニペットを管理するならGistBoxがオススメ](http://works.coldsleep.jp/blog/gistbox/)
- [コードスニペット管理ツール「GistBox」が良いね！とっても良いね！](http://ozpa-h4.com/2014/03/20/gistbox/)
- [メモアプリの決定版はこれだ！](http://qiita.com/sygw/items/df4202a089a6a82847da)
- [Gistを使いやすくするGistboxとThe GistBox Clipperがよさそう](http://rikei-webmemo.hateblo.jp/entry/2014/05/10/182710)