クラウド上にMarkdownで手軽にメモを残せる無料ツール「HackMD」が便利

以前、EvernoteにMarkdownでメモを書けるMarxicoについて書きました。

Evernoteはメモを手軽にノートに残せて便利です。 文字を装飾しようと思えば、ツールボタンでも装飾できます。 ただ、文字を選...

これはこれで便利です。

けれど先日、クラウド上で手軽にMarkdownを使えて、共同編集までできるHackMDというサービスを知って、使ってみたら、それ以上に便利だったので紹介です。

スポンサーリンク
レクタングル(大)広告

HackMDとは

HackMD - 共同編集できるMarkdownノート

HackMDは、Markdown記法で知識を蓄積・共有することができる無料WEBサービスです。

こんな感じで、プレビューで表示を確認しながらMarkdown入力を行うことができるツールです。

HackMDでの入力サンプル - HackMD

入力エディター部分もハイライト表示されますし、入力したMarkdownはすぐにプレビュー画面で確認できるので、使いやすいことこの上ないです。

また、HackMDの大きな特徴として、作成したドキュメントをクラウド上で共同編集できるという点にもあります。

HackMDはURLで共同編集できる

HackMDの説明自体が共同編集モードで書かれているので、使い方や、Markdown記法の書き方自体の勉強にもなります。

Features - HackMD

機能画面のMarkdownにはロックがかかっているので編集はできません。

HackMDのMarkdownで利用できる機能

HackMDには、特徴的な機能もあって、以下のような記述でYouTube動画が埋め込めます(Vimeoにも対応)。

### YouTube
{%youtube 1G4isv_Fylg %}

HackMDでYouTube動画埋め込んだプレビュー

Gistのコードを埋め込んだり

### Gist
{%gist schacon/4277%}

HackMDでGistコードの埋め込みプレビュー

数式を挿入したり

The *Gamma function* satisfying $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$ is via the Euler integral

$$
x = {-b \pm \sqrt{b^2-4ac} \over 2a}.
$$

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

HackMDで数式を挿入したプレビュー

フローチャートを書いたり

```flow
st=>start: Start
e=>end: End
op=>operation: My Operation
op2=>operation: lalala
cond=>condition: Yes or No?

st->op->op2->cond
cond(yes)->e
cond(no)->op2
```

HackMDでフローチャートを書いたプレビュー

その他にも、テキストベースでこんな図を書いて挿入することもできます。

HackMDで様々な図を挿入したプレビューサンプル

また、楽譜なんかも挿入できたりして。

```abc
X:1
T:Speed the Plough
M:4/4
C:Trad.
K:G
|:GABc dedB|dedB dedB|c2ec B2dB|c2A2 A2BA|
GABc dedB|dedB dedB|c2ec B2dB|A2F2 G4:|
|:g2gf gdBd|g2f2 e2d2|c2ec B2dB|c2A2 A2df|
g2gf g2Bd|g2f2 e2d2|c2ec B2dB|A2F2 G4:|
```

HackMDで楽譜を挿入したプレビュー

その他にも様々な機能があるようです。

実際に、こういった機能を利用するかは別として、上記のように、いろいろなことが(やろうと思えば)できるのは楽しいです。

もちろん標準のMarkdownエディターとしてだけでも、十分使いやすいので書いていて気持ち良いです。

サインインしなくても利用可能

HackMDは基本的に、サインインして利用した方が便利なツールです。

けれど、「新規ゲストノート」をクリックすれば、サインイン不要のゲストとして使用できるので、まずは試してみることをおすすめします。

新規ゲストノートでゲスト記入もできる

HackMDの使い方

HackMDは、登録して使うのも非常に簡単です。

HackMDにサインイン

まずは、HackMDから「サインイン」ボタンを押してください。

HackMDでサインインボタンを押す

すると、Facebook、Twitter、GitHub、Dropbox、Google+のアカウントさえ持っていれば、手軽にサインインすることができます。

HackMDでサインイン可能なサービス

僕は、Twitterでサインインしたのですが、付与する権限はこんな感じです。HackMDが要求するTwitter権限

アプリ連携をすると、ダッシュボード(履歴)画面が表示されます。

HackMDのベース画面

新しくノートを作成

新規ノートをクリックすると、新しくノートを書くことができます。

HackMDの新機ノートリンク

例えば以下のように、Markdown記法で入力すると

# HackMDでの入力サンプル
 
HackMDを用いるとMarkdownを用いて手軽にメモを残すことができます。
 
## H2見出し
こんな感じで見出しも入れられます。
 
*イタリック体*や**太字**なんかも簡単。
 
>引用なんかも
>簡単に入れられます
 
非順序リスト
 
+ リストアイテム1
+ リストアイテム2
+ リストアイテム3
 
順序リスト
 
1. リストアイテム1
2. リストアイテム2
3. リストアイテム3
 
テーブル
 
| Left align | Right align | Center align |
|:-----------|------------:|:------------:|
| This       |        This |     This     |
| column     |      column |    column    |
| will       |        will |     will     |
| be         |          be |      be      |
| left       |       right |    center    |
| aligned    |     aligned |   aligned    |

以下のように、入力テキストとプレビュー表示を見ることができます。

HackMDでの入力サンプル例 - HackMD

表示モードを変更すると、プレビューモードならHTML出力画面のみが。

HackMDでの入力サンプル(プレビューモード) - HackMD

エディターモードだと入力したMarkdownのみが表示されます。

HackMDでの入力サンプル(編集モード) - HackMD

ノート自体は、編集権限を変更して、「プライベート表示」にしたり「共同編集モード」にしたり、ある程度自由に変更可能です。

HackMDのノートのロック状態変更メニュー

またその他の機能として、Dropbox、Googleドライブ、Gistにデータをエクスポートしたり、また逆にインポートしたりもできます。

HackMDのメニュー機能

Markdown記法で書いたものをHTMLでダウンロードすることもできるので、Wordpressの下書きとかでも使えそうです。

記入した部分のみをダウンロードする場合は、「HTMLパーツ」メニューを選択してください。

入力ヘルプも日本語表示

「Markdown記法がよくわからん」なんて場合は、ノート編集メニューにある「?」をクリックしてください。

HackMDのMarkdown入力ヘルプ

すると、基本的なMarkdown記法の入力例(チートシート)が日本語で表示されます。

HackMDではMarkdown記法の入力例が日本語で表示

簡単なものなら、このカンニングペーパーのみで十分すぎます。

ダッシュボード(履歴)画面

記入したMarkdownは、特に何もせずともそのまま保存され、ダッシュボード(履歴)画面で以下のように蓄積されていきます。

HackMDのノート履歴

ノート左上の「ピン」マークをクリックすれば、ノートをトップに留めておくこともできます。

HackMDでノートをピンどめ

ノート右上の×印をクリックすれば、不要なノートをすぐさま削除することもできます。

HackMDで不要なノートを削除

不要なものを手軽に消せるのも非常に大事な要素です。

このようなシンプル操作が、使い勝手を良くしていると思います。

タグで管理

ノートをガッツリ管理したい場合は、タグなどをつけて、フィルタリングをすれば、ある程度多くのノートも管理できるかと思います。

HackMDでタグのフィルタリング

タグを挿入する場合は、ノート編集エリア内に、以下のようにタグを設定するテキストを入力すればOKです。

###### tags: `買い物` `予定` `家族共同編集`

可能なら半角英数字の簡単な英単語でタグ付けしておいた方が、インクリメンタルサーチでフィルタリングしやすくなります。

###### tags: `shopping` `todo` `family`

まとめ

Markdown記法は、テキスト入力エリアからマウス操作をせずともキーボード操作のみで、手軽にHTMLを書けるので重宝します。

HackMDを利用することでさらに、プレビュー表示できたり、カンニングペーパーを見たりできるので、より手軽にMarkdown記法を利用することができます。

僕はHackMDを使ってみて、かなり便利だったので、メモの一部は、EvernoteからHackMDに変更して利用しています。メモに手軽に到達しやすく、HTML表示も見やすいので。僕は、Markdownの基礎程度にしか書けないですけど、それでも十分便利。

というわけで「Markdownベースでメモを残したい」とか「クラウドで手軽に使えるMarkdownエディターが使いたい」なんて場合は、HackMDは結構おすすめツールです。Markdownの練習にも最適です。

サイト HackMD