플로그인에 자료로 올리면서 마음에 들어 이번에 개편한 사이트내 한 게시판에 적용해 봤습니다.

개편 사이트가 부트스트랩 기반 UI라서 summernote를 적용하기 위해 확인해보니 bootstrap 라이브러리를 기본 제공하네요.

오픈소스 summernote가 제공하는 기본 기능:

• 기본 및 부트스트랩 라이브러리 제공 (summernote.org)
• 다양한 언어 지원(lang 폴더)
• 프로그램 코드 삽입 지원
• 이미지 삽입 지원
• 동영상 삽입 지원
• 스타일 제거 지원
• html 코드 입력 지원
• ...

욕심이 나서 몇 개 기능을 추가해서 사이트에 반영했습니다.

• 이미지첨부시 base64포멧대신 data/editor폴더에 올리기
• bootstrap5 라이브러리 반영(dark/light mode지원)
• 이미지 최적화 : 큰 이미지를 올려도 1200px폭으로 짤리게 처리, 웹에 최적화된 webp포맷으로 변환
• 비디오 반응형 처리
• ...

여기에 하나 더 

최종 올리기 전에 약간의 편집(사이즈 수정, 회전, 필터 처리 등)이 가능한 기능을 추가.

최종 올리기 전에 이미지를 포토샵처럼 편집을 할 수 있는 기능까지 추가해 봤습니다.

https://youtu.be/GTbpmETjc2I

데모 및 체험 : https://demo.365ok.co.kr/demoskin/bbs/board.php?bo_table=qa