The all-in-one rich-text editor 🚀
In this project, I tried to replicate some feature that is available in Notion, an amazing productivity and note-taking app.
 |
 |
 |
|---|---|---|
| Markup editing | Block editing | Image inserting (pasting URL) |
- ✍️ Basic markups (bold, italic, underline, strikethrough, code snippet)
- 📄 Basic blocks (heading blocks, code blocks, quote, todos, divider)
- 🖼️ Image support (insert image by pasting the source URL 🔗 or drag them to the editor)
- 🖌️ Floating toolbar (highlight a text or click the "..." button on the side)
- ⌨️ Keyboard shortcuts (hover on the buttons on floating toolbar to discover the shortcuts)
This project is proudly built in TypeScript using Next.js, Tailwind CSS, Zustand, and a bunch of Slate.js (it's an amazing customizable framework for building rich text editors, check it out 🙌)
Created by Nourman Hajar (masnormen)