【React】自作Wiki開発ログ:Markdownプレビュー機能とモダンエディタ導入
【概要・やったこと】
現在、自身のナレッジベースおよび日々のログ管理を目的とした「自作Wiki」をReactベースでスクラッチ開発しています。 先日、UIのサイドバー構造やカテゴリーマップの実装を終え、現在はユーザーの執筆体験を向上させるための「モダンなMarkdownエディタの導入」に注力しています。
【直面した課題とアプローチ】
- 課題: 単なるテキスト入力ではなく、リアルタイムでのMarkdownレンダリング(プレビュー)や、直感的なエディタUIをReact環境でどうスマートに実現するか。
- 実装アプローチ: 既存のReact向けエディタライブラリ(
react-markdown、tiptapなど)のリサーチを進めています。 - 現在の進捗: コンポーネントへの組み込みと、入力値のステート管理(useState等)を連携させるところまで進めており、現在は表示の最適化の調整を行っています。
- また、テーマ変更の際に当たるスタイルの整理等も同時並行して進めております。
【今後の展望】
エディタが安定した後は、Wiki内の自動リンク生成(ページ間の紐付け機能)やストレスフリーな記述を行える昨日の実装など、より高度な機能の実装にチャレンジし、最終的には自分の開発環境のメインツールとしてデプロイすることを目指しています。