简介
在这个项目中,我们将创建一个简单的基于网页的 Markdown 编辑器,它能在你输入时提供实时 HTML 预览。通过使用 Ace Editor、marked
和 highlight.js
等库,你将开发一个直观的编辑器,它不仅允许你用 Markdown 进行编写,还能在不同浏览器会话间保存数据,并在预览中突出显示代码片段。
👀 预览

🎯 任务
在这个项目中,你将学习:
- 如何为编辑器和预览器设置 HTML 结构
- 如何对编辑器和预览器进行样式设计以获得愉悦的用户体验
- 如何实现编辑器初始化逻辑
- 如何将 Markdown 解析为 HTML 并在预览器中显示
- 如何在编辑器和预览器之间同步滚动
🏆 成果
完成这个项目后,你将能够:
- 开发一个具有实时 HTML 预览功能的基于网页的 Markdown 编辑器
- 利用 Ace Editor、
marked
和highlight.js
等库增强编辑器的功能 - 实现跨浏览器会话的数据持久化
- 在 Markdown 预览中提供代码语法高亮显示