Skip to content

React용 Rich Text Editor 비교

summernote https://summernote.org/ 를 이용했는데 이번에는 가능하면 jquery를 사용하지 않으려고 하기 때문에 패스!

summernote는 정말 편하게 잘되있다.

내가 원하는 기능은 이미지만 AJAX로 보내지면 된다.
base64로 인코딩되면 나중에 GB단위의 DB용량을 체험하게 될 것이다.

  1. https://github.com/jpuri/react-draft-wysiwyg
    immutable.js 사용
    text값이 immutable로 넘어와 변환해서 저장해야함
    배보다 배꼽이 더 크다.

  2. https://github.com/ianstormtaylor/slate
    아예 프레임워크로 제공
    내가 원하는건 이미지 upload 만 잘되면 되는건데 무겁다.

  3. https://github.com/zenoamaro/react-quill
    이건 순수 JS로 동작한다.
    많은 플러그인을 제공한다. (resize, drap and drop)
    하지만 파일 업로드는 따로 플러그인을 만들어야 한다.

  4. https://github.com/jaredreich/pell
    심플하다
    하지만 문서가 부족하다.

  5. https://github.com/bpetetot/react-pell
    마크다운 까지 지원한다.
    파일 업로드를 제공하지 않는다.

여기까지…
그나마 quill이 쓸만한 것 같다.

다음 포스트는 quill 설치와 file upload 적용방법에 대해서 적어 보겠다.

한국에서 rich text editor는 필수다.
하루 빨리 초등학교에서 마크다운을 필수 교육코스로 체택했으면 좋겠다.

Published inREACT