28
20

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Atomic Chrome for Emacs - EmacsでChromeのテキストエリアをリアルタイム編集

Last updated at Posted at 2016-10-30

ChromeのテキストエリアをEmacsで編集する方法としては、かなり古くからある Edit with Emacs がメジャーなようですが、個人的に一つ不満がありました。一度編集を保存してテキストエリアに反映させてしまうと、続けて編集するには再度ブラウザ側で編集開始しないといけないことです。些細なことですが、Markdownで記述するときなどブラウザ側のプレビュー表示で確認して繰り返し編集したい場合に不便でした。

Edit with Emacs以外によい 拡張はないか調べてみると、エディタを限定すればAtom用の Atomic Chrome、SublimeText用の Ghost Text など、続けて編集できるどころか編集結果がリアルタイムにテキストエリアに反映されるものがありました。どうやら、websocketを利用してコネクション型の通信を行うことで実現しているようです。

Emacsにも以前から websocketの実装 はあり、これを用いてMarkdownのリアルタイムプレビューを行うようなパッケージはあるので、テキストエリア編集についても既に誰かが作っているだろうと思いましたが、調べた限りなさそうでした。幸い、Chrome側の拡張は上記のAtomic Chromeのものをそのまま使わせてもらえばよいので (Chrome拡張の作り方はよく分からない...)、これと接続するEmacs側のパッケージを作ってみました。

MELPAにも登録してあるので、 M-x package-install [RET] atomic-chrome でインストールできます。設定は.emacsに

(atomic-chrome-start-server)

を書くだけで、後はChrome側でテキストエリアをフォーカスしてAtomic Chromeのボタンを押すとEmacs側にバッファが開き、編集結果はリアルタイムにテキストエリアに反映されます。Edit with Emacsに私と同じような不満を持っている方は、是非使ってみて下さい。

2016/11/8 追記

最新バージョンで、Sublime Text用の拡張 Ghost Text にも対応しました。こちらを使うと、下のコメントに書いたQiitaの記事編集でプレビューが更新されない問題もありません。お試し下さい。

28
20
4

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
28
20

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?