https://github.com/mohit138928/react-markdown-previewer

A simple React Markdown Preview project in which you will see the editor toolbar and the previewer toolbar. When you write in the editor Toolbox, you can see the output in the Previewer in the form of Markdown (MD).
https://github.com/mohit138928/react-markdown-previewer

Last synced: 9 days ago
JSON representation

A simple React Markdown Preview project in which you will see the editor toolbar and the previewer toolbar. When you write in the editor Toolbox, you can see the output in the Previewer in the form of Markdown (MD).

• Host: GitHub
• URL: https://github.com/mohit138928/react-markdown-previewer
• Owner: Mohit138928
• Created: 2024-06-28T09:14:50.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-06-28T09:32:09.000Z (5 months ago)
• Last Synced: 2024-06-28T10:53:48.164Z (5 months ago)
• Language: JavaScript
• Homepage: https://react-markdown-previewr.netlify.app/
• Size: 378 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React Markdown Preview

A simple React Markdown Preview project in which you will see the editor toolbar and the previewer toolbar. When you write in the editor Toolbox, you can see the output in the Previewer in the form of Markdown (MD).

## Description

The React Markdown Preview project provides an interface to write Markdown in an editor and see the formatted output in real-time. This project includes an editor toolbar for writing Markdown and a previewer toolbar to display the rendered Markdown.

## Installation

Follow these steps to install and run the project:

1. **Clone the repository:**

   ```sh

   git clone https://github.com/Mohit138928/React-Markdown-Previewer.git

   ```

2. **Navigate to the project directory:**

   ```sh

   cd react-markdown-previewer

   ```

3. **Install the dependencies:**

   ```sh

   npm install

   ```

4. **Install additional libraries:**

   - **Sass:** for CSS

     ```sh

     npm install sass

     ```

   - **Marked:** a low-level compiler for parsing markdown

     ```sh

     npm install marked

     ```

   - **React Icons:** for using icons in React

     ```sh

     npm install react-icons --save

     ```

5. **Run the project:**

   ```sh

   npm run start

   ```

## Usage

1. **Write Markdown:**

   - Use the editor toolbar to write your Markdown content.

2. **Preview Markdown:**

   - View the formatted Markdown in the previewer toolbar in real-time.

## Preview of the Project

![Preview-1](/src/Screenshots/Preview-1.png)

![Preview-2](/src/Screenshots/Preview-2.png)

## Contributing

Feel free to contribute to this project. Any improvements or suggestions are welcome!

## License

This project is open-source and available under the [MIT License](LICENSE).

## Contact Information

If you have any questions or need further information, feel free to contact me at [email protected].