Edited at

VSCodeの拡張機能「GIST」が便利すぎてHackMDを使うのをやめた

メモやドキュメント作成、Qiita投稿の下書きなどにずっとHackMDを利用していたのですが、VSCodeでGitHubGistと連携できる「GIST」という拡張機能を知り、使ってみたらものすごく便利でHackMDを利用する頻度が激減しました。

Visual Studio Code でGitHub Gistを使ってみた

https://gist.github.com/nuovotaka/7bfb8130e0be8b3dae83

kenhowardpdx/vscode-gist: vscode extension for quick gists

https://github.com/kenhowardpdx/vscode-gist

拡張機能__Gist_と_Overview_-_HackMD-2.png

GitHubGistについては下記が参考になります。

Gistsでソースや文書をシェアする - Qiita

https://qiita.com/hkusu/items/18cbe582abb9d3172019

HackMDもリアルタイムプレビューや共同編集ができて素敵です。

機能紹介 - HackMD

https://hackmd.io/s/4JbKDCN1hx

HackMDってMarkdownEditorが革新的で使いやすい - Qiita

https://qiita.com/norinity1103/items/85aa990dbe6582b6d701


利用方法


拡張機能のインストール

VSCodeの拡張機能 MARKETPLACEからgist で検索したらヒットするのでインストールしましょう。

スクリーンショット 2019-02-26 14.51.08.png


GitHubGistのプロファイル作成

拡張機能をインストールしたらVSCodeのコマンドパレットからGIST: Select Profile を選択します。

プロファイルがないと登録するためのダイアログがでてくるので、GitHubのpersonal access tokenを入力して登録します。

拡張機能__Gist_と_Overview_-_HackMD.png

personal access tokenについては下記が参考になります。

GitHub「Personal access tokens」の設定方法 - Qiita

https://qiita.com/kz800/items/497ec70bff3e555dacd0

GitHubアカウントが複数ある場合、プロファイルが追加できます。GitHub Enterpriseにも対応しているのがありがたいです。GitHub Enterpriseの場合、APIのエンドポイントを指定する必要があるので、http(s)://[hostname]/api/v3 の形式で指定します。末尾に/ をつけるとアクセスできないのでご注意ください。

スクリーンショット 2019-02-26 14.36.39.png


Gistの取得・編集

プロファイルが登録できたら、Gistのリスト表示や新規作成・編集ができるようになります。

VSCodeのコマンドパレッドをみたらできることがだいたいわかると思います。詳細は公式のREADMEをご参考ください。

kenhowardpdx/vscode-gist: vscode extension for quick gists

https://github.com/kenhowardpdx/vscode-gist

Gistの新規作成・編集・削除など、ひととおりのことが、VSCodeで完結して操作できます。

Ctrl + s でGitHubGist上のファイルが更新されるので、ローカルのファイルと同じ感覚で編集できます。便利すぎます。

VSCodeでテキストをしたためて、コマンドパレッドでGIST: Create New Gist を選択します。

スクリーンショット 2019-02-26 15.00.33.png

ファイル名で拡張子を指定し忘れるとサイトでしか修正できないのでご注意ください。

スクリーンショット 2019-02-26 15.00.49.png

概要やPublic/Private指定するとGitHubGistと連携してGistが作成されます。

スクリーンショット 2019-02-26 15.01.01.png

スクリーンショット 2019-02-26 15.01.13.png

スクリーンショット 2019-02-26 15.01.28.png

スクリーンショット 2019-02-26 15.02.07.png


参考

kenhowardpdx/vscode-gist: vscode extension for quick gists

https://github.com/kenhowardpdx/vscode-gist

Gistsでソースや文書をシェアする - Qiita

https://qiita.com/hkusu/items/18cbe582abb9d3172019

機能紹介 - HackMD

https://hackmd.io/s/4JbKDCN1hx

HackMDってMarkdownEditorが革新的で使いやすい - Qiita

https://qiita.com/norinity1103/items/85aa990dbe6582b6d701

GitHub「Personal access tokens」の設定方法 - Qiita

https://qiita.com/kz800/items/497ec70bff3e555dacd0