Enhanced Markdown Editor

A powerful web-based Markdown editor with real-time preview, table management, and extensive formatting options.

✨ Features

Core Functionality

• 📝 Real-time Preview

  • Side-by-side Markdown and HTML preview
  • Instant rendering updates
  • Smooth scrolling sync between panels

• 🎨 Rich Formatting

  • Headers (H1-H6)
  • Text styling (Bold, Italic, Strikethrough)
  • Lists (Ordered, Unordered, Tasks)
  • Code blocks with syntax highlighting
  • Tables with visual editor
  • Blockquotes
  • Horizontal rules
  • Mathematical expressions (LaTeX support)

• 📊 Advanced Table Management

  • Intuitive table creator
  • Visual column/row operations
  • Cell merging and splitting
  • Sort table data
  • CSV import/export

Additional Features

• 🌓 Theme System

  • Dark/Light mode toggle
  • Auto-detect system preference
  • Custom theme support
  • Persistent theme settings

• 💾 Data Management

  • Auto-save functionality
  • Local storage backup
  • Version history
  • File import/export
    • Markdown (.md)
    • HTML export
    • PDF export
    • Plain text

• 🎯 Productivity Tools

  • Custom keyboard shortcuts
  • Command palette
  • Find and replace
  • Word count and statistics
  • Table of contents generation
  • URL auto-linking

• 🔧 Advanced Options

  • Custom CSS support
  • Markdown extension configuration
  • Plugin system
  • API for external integrations

🚀 Quick Start

Local Installation

1. Clone the repository:

git clone https://github.com/SNO7E-G/markdown-editor.git
cd markdown-editor

2. Open index.html in your web browser

No build process or dependencies required! The editor runs entirely in the browser.

🎮 Usage

Basic Usage

1. Open the editor in your browser
2. Start typing in the left panel
3. See real-time preview in the right panel
4. Use the toolbar for quick formatting
5. Toggle dark/light theme as needed

⌨️ Keyboard Shortcuts

Action	Windows/Linux	macOS
Bold	Ctrl + B	⌘ + B
Italic	Ctrl + I	⌘ + I
Insert Link	Ctrl + K	⌘ + K
Insert Image	Ctrl + Shift + I	⌘ + Shift + I
Save	Ctrl + S	⌘ + S
Find	Ctrl + F	⌘ + F
Replace	Ctrl + H	⌘ + H

🛠️ Technology Stack

• Frontend:

  • HTML5
  • CSS3 (with CSS Variables)
  • JavaScript (ES6+)
  • Local Storage API
  • File System API

• Libraries:

  • marked.js - Markdown parsing
  • highlight.js - Code syntax highlighting
  • KaTeX - Math rendering
  • DOMPurify - XSS sanitization

🤝 Contributing

We welcome contributions! Here's how you can help:

1. Fork the repository
2. Create your feature branch:

   git checkout -b feature/AmazingFeature

3. Commit your changes:

   git commit -m 'Add some AmazingFeature'

4. Push to the branch:

   git push origin feature/AmazingFeature

5. Open a Pull Request

Development Setup

1. Fork and clone the repository
2. Open the project in your favorite editor
3. Start making changes
4. Test thoroughly
5. Submit a PR

📜 License

This project is licensed under the MIT License - see the LICENSE file for details.

👤 Author

Mahmoud Ashraf (SNO7E)

• GitHub: @SNO7E-G
• LinkedIn: Mahmoud Ashraf

🙏 Acknowledgments

• Thanks to all contributors who've helped make this editor better
• Special thanks to the creators of marked.js and highlight.js
• Inspired by various markdown editors in the open-source community

📊 Project Status

• ✅ Actively maintained
• 📈 Regular updates
• 🐛 Bug reports welcome
• 💡 Feature requests welcome

---

Made with ❤️ by SNO7E