https://github.com/lrmn7/markdown-editor

Last synced: about 2 months ago
JSON representation

Host: GitHub
URL: https://github.com/lrmn7/markdown-editor
Owner: lrmn7
License: mit
Created: 2023-06-08T14:11:16.000Z (about 3 years ago)
Default Branch: main
Last Pushed: 2023-06-25T14:37:23.000Z (about 3 years ago)
Last Synced: 2024-05-01T22:37:59.469Z (about 2 years ago)
Language: TypeScript
Size: 146 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 1
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE

Awesome Lists containing this project

README

          


  



###

Connect with me:













###

hey there 👋


###



  



###

 
💔 love has a cost, and both of us lost


###

 What i'am listening to 


![](https://spotify-github-profile.vercel.app/api/view.svg?uid=hjn5rpwib3744xmkulex0vw4v&redirect=true][https://spotify-github-profile.vercel.app/api/view.svg?uid=hjn5rpwib3744xmkulex0vw4v&cover_image=true&theme=novatorem)

###

Support me

- 👉 🇮🇩 [Trakteer](https://trakteer.id/lrmn)

- 👉 🌍 [BuyMeACoffe](https://www.buymeacoffee.com/lrmn)

- 👉 🌍 [Ko-Fi](https://ko-fi.com/lrmn7)

# Markdown-Editor

This is a simple live markdown editor, build with React (Vite) and Chakra UI. You can access the live demo at [markdown-editor.is-a.fun](https://markdown-editor.is-a.fun).

Actually, I made it for myself. But of course I'm open to any feedbacks. You can fork or clone this repo and make a PR here if you have some idea.

## What I'm use here?

- [Vite](https://vitejs.dev/guide/#scaffolding-your-first-vite-project) as build tool.

- [Chakra UI](https://chakra-ui.com/docs/getting-started) as UI Library.

- [React Markdown Preview](https://github.com/uiwjs/react-markdown-preview) to make the markdown preview result.

- [React TextArea Editor](https://github.com/uiwjs/react-textarea-code-editor) as the text editor component.

## How to use it?

- Open [markdown-editor.is-a.fun](https://markdown-editor.is-a.fun)

- You can input your markdown text at the textarea input, and the preview will be displayed live.

- Here's [Markdown Cheatsheet](https://www.markdownguide.org/cheat-sheet) to help you write the markdown text.

## References

- [Vite Docs](https://vitejs.dev/) - Learn about Vite and its features

- [Chakra UI](https://chakra-ui.com/) - UI component

- [Typescript](https://www.typescriptlang.org/) - The programming language

- [React Markdown Preview](https://github.com/uiwjs/react-markdown-preview) - For the markdown previewer component.

- [Freepik Image](https://image.flaticon.com/icons/png/512/1031/1031982.png) - For the image asset.

## Future Improvement

- [x] Reset the textarea button

- [x] Copy the clipboard button

###