Markdown Editor 📃

A web-based markdown editor with live preview and persistent storage.

Features • Tech Stack • Installation • Contributing • Screenshots • Live • Author

✨ Features

• Live Markdown Preview: Instantly see the rendered output as you type.
• Split View Mode: Edit markdown and view the preview side-by-side.
• Rich Text Formatting: Supports common markdown elements (bold, italics, headings, lists, code blocks, etc.).
• Persistent Storage: Saves your notes automatically using Firebase, so your work is never lost.
• User-Friendly UI: Clean and minimal interface for a distraction-free writing experience.
• Responsive Design: Works seamlessly on all devices, from desktops to mobile phones.

🛠 Tech Stack

Core Technologies

• React: A JavaScript library for building user interfaces.
• Vite: A fast development environment for modern web apps.
• Firebase: A platform for building web, mobile, and desktop applications.

Libraries

• React-mde: A robust markdown editor component for React.
• React-split: A component for creating split view layouts.

Other

• HTML5: For structuring the web application's content.
• CSS3: For styling and layout.
• JavaScript: For core logic and interactivity.

🚀 Installation

1. Clone the Repository:

   git clone https://github.com/Ashwin-S-Nambiar/Markdown-Editor.git
   
   cd Markdown-Editor

2. Install Dependencies:

   npm install

3. Start the Development Server:

   npm run dev

The app will be available at http://localhost:5173.

🤝 Contributing

Contributions are welcome! If you'd like to enhance the Markdown Editor, follow these steps:

1. Fork the repository

2. Create a new feature branch:

   git checkout -b feature/your-feature-name

3. Make your changes and commit them:

   git commit -m "Add some feature"

4. Push to the branch:

   git push origin feature/your-feature-name

5. Open a Pull Request

📸 Screenshots

Editor Interface

Split View Mode

Rendered Markdown Preview

🌍 Live

👤 Author

Ashwin S Nambiar

• Portfolio: ashwin-s-nambiar.is-a.dev
• GitHub: @Ashwin-S-Nambiar

---

Made with ❤️ by Ashwin S Nambiar