at backyard

Color my life with the chaos of trouble.

Lexicalを使って画面が二分割されているタイプのMarkdown エディターを作ってみた

下書きに入れていたまま塩漬けになっていた生地をまたしても見つけた。というか割とたくさんの塩漬けがある。。

このまま塩漬けにしていてもしょうがないので公開する。

lexicalを触っていた時のものだが、絶賛開発中のプロジェクトだと思うのでこの記事に関するソースなども古くなっているかもしれないことは一応書いておく。

以下本文。

——————————————————————-

最近Lexicalに触れる機会があり、個人的にも興味があるプロダクトだったため、Lexicalを使って試しにMarkdown エディターを作ってみた。

ソースコードは下記。

github.com

最近はVSCodeで使うときぐらいしか見ることはなかったが、少し前は画面が二分割されているタイプのMarkdownエディターをMac上で使っていたこともあり、そんなやつをReactを使って作ってみることにした。

なお、Lexicalはまだ絶賛開発中という感じで、破壊的変更が途中で入っていたりもするので、人が書いたブログを見るよりは Lexical の公式ドキュメントやソースコードを見るほうが確実だと感じた。 また、Lexical自体のドキュメントもまだ充実しておらず、READMEに書かれているサンプルコードも簡素化されており実際のインターフェースとは異なるものなどもあったりするため、そういう意味ではソースコードやそれに近い部分(ソースコード上に書かれているコメントなど)を見るほうが良いかもしれないと思ったりもした。

というわけで、このブログでも上に載せたソースコードの解説を入れようかと思ったが、書いても役に立たなくなる可能性ありなので文章はこれぐらいに留めておく。