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