📃 Markdown Editor

Live: https://markdown-editor-gray-six.vercel.app/

Description:
Markdown Editor is a web-based application that provides a seamless and feature-rich markdown editing experience. Users can write, preview, and format markdown content efficiently. Built using React and enhanced with Firebase for data persistence, this project was developed as part of my learning journey with Scrimba.

🎨 Features

• Live Markdown Preview: Instantly see rendered markdown while typing
• Split View Mode: View raw markdown and rendered content side by side
• Rich Text Formatting: Supports bold, italics, headers, lists, code blocks, and more
• Persistent Storage: Saves notes automatically using Firebase
• User-Friendly UI: Clean and minimal interface for easy usage
• Responsive Design: Works smoothly on all devices

🛠️ Tech Stack

• Frontend:
  • React - A JavaScript library for building UI
  • Vite - Fast development environment
  • React-mde - Markdown editor component
  • React-split - Split view functionality
  • HTML5 - Structuring the web app
  • CSS3 - Styling and layout
  • JavaScript - Core logic and interactivity
• Backend & Database:
  • Firebase - Realtime data persistence

🚀 Installation & Running Locally

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

🧑‍💻 Author

Ashwin S Nambiar