17
17

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 5 years have passed since last update.

gistをbl.ocks.org以外で動かす

Last updated at Posted at 2014-07-29

背景

先日Qiitaに投稿されたちょっとしたHTMLはGitHub Gistに置いてbl.ocks.orgで表示するのがお手軽ですという記事をはてブ経由で知りました。
自分はもっと前からbl.ocks.orgを知っていましたが、結構なブクマが付いていたので驚きでした。(ホントは悔しかったw。内容は自分にとってもへーって感じですごいなぁ色々調べてるなぁと後からこっそり見て感じましたw)

ちょうどこれと同時期に@Phiさんがログイン不要! 気軽にプログラミングを始められるWebエディタ『runstant』作りましたを投稿されました。

初めは、この2つは自分の中ではリンクせず、むしろ、gistを使ったbl.ocks.orgだと、gistを編集してから反映されるまでのタイムラグが当時気になり、トライ&エラーなスタイルでの開発に向かないから、runstant推しって感じでした。

gistをJSONPで取得できた

Gist外部埋め込みHTMLをJSONPで受け取るなる投稿を見つけました。

gistとrunstantが繋がった

そんな訳で、runstantはいつでもどこでも簡単に使えるので、gistの上げた、HTML,CSS,JavaScriptをrunstantで動かすツールを作ってみました。

成果物

色々と不具合ありそうなので、以下のGist経由で試して下さい。

コマンドラインツールも鋭意作成中

近々、前述のツールを応用して、引数にgistのurl指定を実装したところですが、
現状は、ローカルファイルのrunstantでの実行のみです。

Atom.ioやEmacs,viなど好みのエディタでrunstantが使えるようになります。(runstantのコンセプトと合わない気も。。)

あとがき

それにしても、CSSは未だに自由に扱えません。まぁ、JavaScriptが自由に扱えたりするわけでもありませんが。

gist2runstantはFirefox上で主に開発して当初はXPathでJSONPで取得したJSONからコードを取り出そうとしていたのですが、Chromeでは、XPathで取得する箇所でエラーになり、これに対応するために、正規表現で取得するようにしてます。なので、Firefoxでも動きます。

関連記事

17
17
0

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
17
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?