slack editor
-
Slack에서 쓰는 에디터를 비슷하게 구현해보자 (drag & drop포함)Front-end/React 2023. 1. 8. 19:06
React-Quill을 이용하여 Slack의 editor 구현해보기 (Nextjs) 게시판 글쓰기, 댓글, 건의사항 작성, 등 이런 기능들을 개발할 때 간단하게 textarea로 개발할 수 있지만 이미지, 링크, 코드에디팅 등의 기능이 필요한 경우 별도의 에디터가 필요한 경우가 많습니다. 직접 개발할 수 있지만 보통은 library를 이용해서 개발을 진행합니다. 여기에선 react-quill 라이브러리를 이용한 방법을 공유합니다. 그러나 다른 에디터의 경우는 모르겠지만 react-quill의 경우 보통 이미지를 copy+paste를 진행하면 아래 이미지처럼 에디터 내부에 이미지가 들어갑니다. 이런 상황이 발생하면 에디터 내부가 어지럽고 이미지가 좀 클 경우 에디터의 높이가 증가할 수 있습니다. 아래 그림..