【入門】Github Gistとは？概要や基本的な使い方をわかりやすく解説

自分が作った断片コード（スニペット）を共有したり、他開発者が作った断片コードを探したりしたいときに使えるのがGitHub Gistです。GitHub Gistを使えば、断片コードを手軽に共有・検索できるでしょう。

この記事では、Github Gistとは何かといった概要や、メリット・デメリット、基本的な使い方についてわかりやすく解説しています。Github GistはGitHubのアカウントさえあれば無料で使えるので、この記事を参考に試用いただければ幸いです。

Github Gistとは【断片コード（スニペット）の共有サービス】

Github Gistとは、GitHubが提供する断片コード（スニペット）の共有サービスです。

Github GistはGitHubと同様にリポジトリを採用しており、ソースコードのバージョン管理ができます。

Github GistはGitHubのアカウントさえあれば、GitHubの管理画面もしくは公式サイトURLから利用が可能です。

Github Gistへ保管したソースコードを、Webサイトなどに埋め込む際に使える専用タグをコピーする機能もあります。

Github Gistを使うメリット

Github Gistを使うメリットとして、以下が挙げられます。

Github Gistは簡単な操作で、手間なく断片コードを管理・公開できる点は大きなメリットといえるでしょう。

GitHub Gistを使い、Webページへ任意のソースコードを埋め込み公開する人も多いです。

Github Gistを使うデメリット

GitHub GistはGitHubよりシンプルで手軽に使える反面、GitHubに比べると機能性が低い点はデメリットです。たとえばプレビュー機能・画像アップロード機能などは、GitHub Gistにはありません。

またGitHub Gistだけを使いたいときも、GitHubのアカウントが必要な点もデメリットといえます。

GitHub GistとGitHubは、それぞれ特徴が異なるので適宜使い分けましょう。

断片コードをシンプルに管理・公開したいケースでは、GitHub Gistが適しています。

Github Gistの使い方

ここではGitHub Gistの使い方（gistの作成方法・検索方法など）を解説します。この項の内容を参考にすれば、GitHub Gistの基本的な機能の利用が可能です。

なおGitHub Gistを使うためには、あらかじめGitHubのアカウントを作成しておく必要があります。GitHubのアカウントを持っていない方は、以下記事を参考にGitHubアカウントを作成して下さい。

gistを作成する方法

まずはGitHub Gistの以下公式サイトへアクセスして下さい。

https://gist.github.com/

gistのリポジトリを作成する画面が表示されます。以下の通り、入力・選択してgistのリポジトリを作成して下さい。

① Gist description…
gistの簡単な要約を記載します。ソースコードを公開したりあとで自分で見直したりする際に、分かりやすい要約を記載しましょう。

② Filename including extension…
「example.html」「test.php」のように、ファイル名を記載します。

③ 入力欄
gistに登録したいソースコードを入力します。ソースコードが記載されたファイルをこの欄にドラッグ＆ドロップして入力することも可能です。

④ Creat secret gist
非公開のgist（secret gist）が作成したい場合は「Create secret gist」をクリックします。これでgistの作成は完了です。gistを公開する場合は、プルダウンで「Create public gist」を選んでクリックして下さい。

※非公開を選んだ場合でも、作成したgist操作画面のURLさえ分かれば第三者でもアクセスが可能です。

gistの作成が完了すると、以下のように作成したgistの操作画面が表示されます。

この画面で作成したgistの内容を確認できる他、gistの編集（Edit）や削除（Delete）が可能です。

作成したgistを参照する方法

作成したgistを参照したい場合は、GitHub Gistのトップページで「View your gists」をクリックします。

以下のように作成済のgistの一覧が表示されるので、参照したいgistの文字列（以下の例では「index.html」など）をクリックします。

そうすると、以下のように作成したgistの操作画面が表示されます。

Webサイトなどにソースコードを表示する

gistにアップロードしたソースコードを、Webサイトなどに埋め込んで表示させることができます。

ソースコードを埋め込みたい場合、対象となるgist操作画面で、「Embed」の横にあるコピーボタンをクリックして下さい。

これで、ソースコードを埋め込むための専用タグがコピーされました。あとは、ソースコードを埋め込みたいWebページなどにコピーした専用タグを貼り付けて下さい。

専用タグを貼り付けると、以下のように埋め込んだソースコードが表示されます。

他ユーザーのgistを探したい場合

他ユーザーのgistを探したい場合は、gist管理画面上部の「All gists」をクリックするか「Search」で検索を行います。All gistsをクリックした場合は、新しく作成された順などで他ユーザーのgistを表示可能です。

git cloneでgistをローカルに複製する

gistはリモートリポジトリなので、GitHubのリポジトリ同様の操作が可能です。

たとえばgit bashなどのコマンドラインツールで、以下のようにgit cloneコマンドを実行すると、gistをローカルに複製できます。

git clone https://gist.github.com/･････

※git cloneしたいgist操作画面のURLを指定してください。

git cloneコマンドを実行すると、以下のように対象のgistがローカルに複製されます。

※フォルダ名は、gist操作画面URLのディレクトリ名が使用されます。

まとめ

Github Gistは、手軽に断片コード（スニペット）を共有できるサービスです。Github Gistを使えば簡単な操作で自分の作った断片コードを他ユーザーと共有したり、他開発者の断片コードを検索したりできます。

Github Gistを使うことで、Github Gist上のソースコードをWebページに埋め込むことも可能です。またGithub gistはリモートリポジトリなので、GitHub同様にgit cloneなどのコマンドを実行することもできます。