ペライチの markdown のコードブロックをビルドして iframe の中で実行できる https://markdown-code-runner.netlify.com で遊べる。 前々から作れるなと思っていたので作ってみた。3時間ぐらいかかった。 仕組み monaco-editor でコード編集 remark で codeblock の AST を収集 rollup と rollup-plugin-virtual でインメモリ上に依存を構築して bundle iframe でクロスドメイン制約を与えた状態で実行(ifram.sandbox="allow-scripts") 外部からの入力受け取れないし、そもそも自動実行できないのでコード実行とはいえセキュリティ要件はそこまで厳しくないはず TODO 実験的に React だけ特別扱いしてるが npm 対応したい monaco の補完用