はじめに
このプロジェクトでは、入力中にリアルタイムでHTMLプレビューを提供するシンプルなウェブベースのMarkdownエディタを作成します。Ace Editor、marked
、およびhighlight.js
のようなライブラリを使用して、Markdownでの記述だけでなく、ブラウザセッション間でデータを保存し、プレビューでコードスニペットを強調表示する直感的なエディタを開発します。
👀 プレビュー

🎯 タスク
このプロジェクトでは、以下を学びます。
- エディタとビューアのHTML構造を設定する方法
- 快適なユーザーエクスペリエンスのためにエディタとビューアをスタイリッシュにする方法
- エディタの初期化ロジックを実装する方法
- MarkdownをHTMLにパースし、ビューアに表示する方法
- エディタとビューアの間のスクロール同期を実装する方法
🏆 成果
このプロジェクトを完了すると、以下のことができるようになります。
- リアルタイムHTMLプレビュー付きのウェブベースのMarkdownエディタを開発する
- Ace Editor、
marked
、およびhighlight.js
のようなライブラリを使用して、エディタの機能を強化する - ブラウザセッション間でデータ永続化を実装する
- Markdownプレビューにコード構文強調表示を提供する