企業やチームの情報共有に便利な esa というウェブサービスがあり、そこの開発者周辺の人が集まるesaグループで勝手に自転車日記を書いています。

esaのエディタが使いやすかったり、入力できるものの自由度が高かったりするので、その辺で気に入っていることをまとめました。

マークダウンプレビュー

さわり初めの頃はマークダウンに不慣れだったので、入力した文字列がどう表示されるのか不安でした。esaは2ペインで常にプレビューが出ているので、表示確認しながら入力が続けられます。プレビューの見た目もきれいなので気に入っています。

Github にもプレビューが付いていて、初めて触った時は何度も Cmd + Shift + P を押してました。マークダウンを書いていると区切りのつもりで --- を使ったら見出しになってることがあるので、意外とプレビュー大事です。

プレビューは MouAtom などのデスクトップアプリにもありますが、ウェブサービスに付いているものは初めてじゃないかな?と思います。

入力フォームにドラッグで画像ファイルが追加できる

最近のウェブサービスは標準で使えることが多いですが、画像をドラッグで追加できます。画像以外も5MBまでなら追加できるので、PSDやzip、movなどを付けることができます。

あと、Retinaディスプレイで撮ったスクリーンショットをクリップボードから貼り付けると、縮小して入ってくれます。
例:Cmd + Shift + Control + 3Cmd + V

PNGファイルを生成する方のスクリーンショット(上のショートカットから Control を外したもの)は、そのまま大きい画像として入ります。

フォント芸ができる

マークダウンなのでHTMLも書けるんですが、style属性なども使えるため、簡単なカラーコードの共有などができます。

こういう事もできます。

YoutubeやTwitterが貼れる

いくつかの許可されたサービスは記事内に載せることができます(esaで遊びながら要望を出していたら実装されてました)。

Twitter


※ 募集中です

Vine

Youtube

Instagram

Instagramは未対応ですが、要望を出すと対応してくれるかもしれません。
ただ埋め込みコードが汚いので、対応してくれないかもしれません。

あと、XSSの温床になるかもしれないので修正されるかもしれません。

ショートカットが便利

この辺をよく使います。慣れてくると Github 上でも同じ動作を期待して押してる時があります。

  • Cmd + S で保存できる(WIPになる)
  • Cmd + Enter で Ship It! できる
  • Cmd + E で編集モードになる
  • S で 🌟 が付く

入力補完が便利

特にリスト記号の補完が気に入ってます。マークダウンエディタは標準機能にしてほしい。数字リストにも対応していて、Tab で入れ子にできるのも良いです。

テーブルはたまにしか使いませんが、こちらにも入力補完が付いていて便利です。

入力部分はほぼ Github の上位互換なので、タスクリストや絵文字 🐼 、メンション、記事IDからのリンクなどの機能が入っており、それぞれにサジェスト機能も付いています。

普段の使い方

このブログの下書き用として使っていて、自転車で遠くに行って帰ってきたら30分くらいでバババーっと書き散らしてます。

ツーリング後はテンションが高い時もあるので、後日冷静な目で見なおして、内容的に危なくなさそうな物を選んでコピペして、Hexoに持ってきています。
2番めのtumblrテーマのエントリはまだ持ってきてませんが、ファイル自体はここに置いてあります。https://github.com/monoooki/tumblr-esa-theme

Hexoもマークダウンに対応しているので、esaの内容をエディタに貼り付けて、Front-matterのタイトルと日付の辺りを調整したら完成です。便利ですね。