Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alidantech/markdown-previewer
A markdown previewer where you can edit markdown and see its preview in real-time.
https://github.com/alidantech/markdown-previewer
bootstrap freecodecamp js markdown previewer react react-redux
Last synced: about 1 month ago
JSON representation
A markdown previewer where you can edit markdown and see its preview in real-time.
- Host: GitHub
- URL: https://github.com/alidantech/markdown-previewer
- Owner: Alidantech
- Created: 2023-04-04T17:21:10.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2023-06-24T15:12:59.000Z (over 1 year ago)
- Last Synced: 2024-03-17T05:13:35.444Z (10 months ago)
- Topics: bootstrap, freecodecamp, js, markdown, previewer, react, react-redux
- Language: JavaScript
- Homepage:
- Size: 413 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Markdown-Previewer
A Markdown Previewer project built using Bootstrap, CSS, Redux, JavaScript, React, and Font Awesome.
## Project Overview
This project is a Markdown Previewer web application that allows users to write Markdown syntax in a text editor and see the real-time preview of the rendered HTML output. It helps users visualize how their Markdown content will appear when rendered as HTML.
The project includes the following features:
- Textarea element to enter Markdown text.
- Preview element to display the rendered HTML output.
- Integration of the [marked](https://marked.js.org/) library to convert Markdown to HTML.
- Support for GitHub flavored Markdown.
- Default content in the editor showcasing various Markdown elements.
- Optional feature to interpret carriage returns as line breaks (br elements).
- Utilization of Bootstrap for responsive and visually appealing design.
- Redux integration for managing the application state.
## Installation and Setup
1. Clone the repository:
```bash
git clone https://github.com/Alidante254/Markdown-Previewer.git
```
2. Change to the project directory:
```bash
cd markdown-previewer
```
3. Install the dependencies:
```bash
npm install
```
4. Start the development server:
```bash
npm start
```
5. Open the web browser and visit `http://localhost:3000` to access the Markdown Previewer.
## Technologies Used
- HTML
- CSS (including Bootstrap)
- JavaScript
- React
- Redux
- Font Awesome
## Future Enhancements
- Add the ability to save and load Markdown files.
- Provide a theme switcher for different previewer styles.
- Implement user authentication and user-specific profiles.
- Add additional Markdown features or customization options.
Feel free to contribute to the project by opening issues or submitting pull requests.
## Author
[Peter Irungu](https://github.com/Alidante254)
## License
This project is licensed under the [MIT License](LICENSE).