[Django] 프로젝트에 toast-ui-editor 적용하기(django admin)
"""
이게 아닐 수도 있숩니다 허허
"""
진행중인 프로젝트에서 ckeditor와 같은 리치 텍스트 에디터를 사용하게 됐습니다.
하지만 ckeditor의 라이센스와 관련해서 말이 많더라구요!?
아래 글에서는 라이센스 문제를 크게 생각하지 않아도 된다고 하지만,,
실제로 사용자들에게 배포될 서비스이기에 라이센스 문제가 엮이게 되면 골치 아플거 같았습니다.
무료이면서 강력한 기능을 가진 toast-ui-editor를 사용하고자 합니다.
https://jjong-factory.tistory.com/54
CKEditor5 - Web Editor CKEditor5 소개 및 라이센스 문제
CKEditor 예전에는 웹 에디터로 네이버 스마트에디터2를 사용하다가, 요즘 디자인에는 너무 구시대적 이라는 발상이 들어서 새로운 에디터를 찾아보다 Ckeditor를 찾게 되었다. CKEditor | Smart WYSIWYG HTM
jjong-factory.tistory.com
toast ui editor란?
https://nhn.github.io/tui.editor/latest/
https://nhn.github.io/tui.editor/latest/
🚩 Table of Contents Collect Statistics on the Use of Open Source TOAST UI products apply Google Analytics (GA) to collect statistics on the use of open source, in order to identify how widely TOAST UI Editor is used throughout the world. It also serves
nhn.github.io
NHN에서 만든 MIT 라이센스 기반의 Editor 입니다.
마크다운과 위지웍을 동시에 지원하는 아주 강력한 친구죠!
가장 중요한건 무료🙃
우선 Django 기반의 프로젝트에 toast ui editor를 합쳐야하기에,, 아래의 친구를 사용했습니다!
https://github.com/QbDesu/django-tui.editor
GitHub - QbDesu/django-tui.editor: Django WYSIWYG markdown editor that supports GFM
Django WYSIWYG markdown editor that supports GFM. Contribute to QbDesu/django-tui.editor development by creating an account on GitHub.
github.com
django 프로젝트에서 저 디렉토리를 하나의 앱으로 인식을 해야하기에,
django-tui.editor/src/django_tuieditor 디렉토리만 프로젝트의 루트 디렉토리에 이동시켜줬습니다. (위 사진 참고)
프로젝트의 config/settings.py를 수정해줍니다.
INSTALLED_APPS에 'django_tuieditor'를 추가해줍시다.
이렇게만 하면 합칠 준비 끝!
이제 tui-editor를 적용할 필드들을 아래와 같이 MarkdownField 로 바꿔주면 됩니다!
요로코롬 하고 페이지에 들어가보면!?
tui editor가 적용이 된 것을 확인할 수 있습니다 허허