Skip to content

Latest commit

 

History

History
83 lines (53 loc) · 2.88 KB

README.md

File metadata and controls

83 lines (53 loc) · 2.88 KB
Raw

📝 Markdown Editor

Welcome to the Markdown Editor project! This web-based editor allows you to write, format, and preview Markdown in real-time, making it a perfect tool for content creators, developers, and anyone who loves working with Markdown. 🚀

✨ Features

  • Real-time Markdown Preview: Type Markdown on the left pane and instantly see the rendered output on the right.
  • Dynamic Theme Toggle: Switch between light and dark modes to suit your preference.
  • Text Formatting Tools: Apply bold, italic, headers, links, and code formatting to selected text with a single click.
  • Syntax Highlighting: Code blocks are highlighted using highlight.js to enhance readability.
  • Save and Load Files: Save your Markdown content to a file or load existing Markdown files directly into the editor.

🔗 Live Demo

Check out the Live Demo on CodeSandbox to see it in action.

🚀 Getting Started

Prerequisites

To run this project locally, you will need:

  • Node.js installed on your machine.
  • A package manager like npm (comes with Node.js) or yarn.

Installation

  1. Clone the repository:

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

  2. Install the dependencies:

    npm install
# or
yarn install

  3. Run the development server:

    npm start
# or
yarn start

    The editor should now be running on http://localhost:3000.

📚 Usage

  • Write Markdown: Type your Markdown text in the left pane.
  • Apply Formatting: Use the toolbar buttons to quickly apply bold, italic, links, headers, and code formatting.
  • Toggle Theme: Click the theme toggle button to switch between light and dark mode.
  • Save and Load Files: Use the save button to download your Markdown to a file, or load a Markdown file from your local storage.

🎨 Customization

You can customize the editor by:

  • Modifying the CSS: Change index.css to adjust the styles to your liking.
  • Changing the Theme: Customize highlight.js themes for syntax highlighting in App.js.

🤝 Contributing

Contributions are welcome! Please fork the repository and submit a pull request. For major changes, please open an issue first to discuss what you would like to change.

📄 License

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

✨ Acknowledgments

Feel free to reach out if you have any questions or suggestions! Enjoy using the Markdown Editor! 🌟