Redmine Editor 플러그인을 만들어 볼까?

노션(Notion)을 자주 사용하다 보니 자연스럽게 Block Object 방식의 에디터에 익숙해졌습니다. 텍스트 하나하나가 블록이 되고, 각 블록을 이동하거나 스타일을 바꾸는 그 방식은 협업과 정리에 최적화되어 있다는 느낌을 받습니다.

그런데 문득, Redmine의 기본 에디터는 너무나도 정적이고, 고전적인 느낌이 들었습니다.
프로젝트 관리나 이슈 트래킹처럼 지속적인 협업이 필요한 도구일수록 더 직관적이고 유연한 에디터가 필요하지 않을까?

그래서 생각했습니다.
👉 “Block 방식의 에디터를 Redmine에 직접 붙여보자!”

 

오픈소스를 찾으며 시작

무작정 만들기보다는 기반이 될 오픈소스를 찾는 것이 먼저였습니다. 그래서 조사해본 결과:

• BlockNote: Notion 스타일의 리치 텍스트 에디터, React 기반
• Editor.js: JSON 기반의 블록 에디터, 비교적 프레임워크에 독립적
• TipTap: ProseMirror 기반의 강력한 확장성 제공
• 그 외 Draft.js, Slate.js 등도 후보에 올랐습니다.

이 중 BlockNote가 구조적으로 Notion과 가장 유사하고, 오픈소스 커뮤니티도 활발해 우선 테스트 대상으로 삼았습니다.

 

Redmine 5에 붙이기 위한 시행착오

문제는 바로 Redmine과의 궁합이었습니다. Redmine은 전통적인 Ruby on Rails 기반의 MVC 프레임워크로 동작하고 있고, BlockNote는 최신 React + TypeScript 환경에서 돌아갑니다.

Redmine 5 위에서 돌아가도록 다음과 같은 작업을 하나하나 수작업으로 해나가고 있습니다:

• Redmine Plugin 구조 안에 React 환경 구성 (이게 가장 골치 입니다.)
• Webpack 설정을 통한 에디터 번들링
• 기존 에디터를 대체하기 위한 View Hook 처리
• 서버로 Block Object를 저장하고 불러오는 구조 설계

컨셉이야..좋지...정말... 노가다의 연속입니다 😅
에러 하나 해결하면 새로운 에러가 반기고, 의존성 충돌은 기본입니다.

---

완성되면 오픈 예정!

아직은 실험적이고 개발 초기 단계입니다.
그렇지만 Redmine을 쓰면서도 Notion처럼 직관적인 블록 편집을 할 수 있다면, 분명 많은 사람들에게 도움이 될 수 있을 거라 믿습니다. 유지보수는 아직 고려하고 있지 않지만... 일단 만들어 보는 것으로 흥을 돋구어 보려고 합니다.

완성되면 GitHub에 오픈소스로 공개해 볼께요. 

오늘 건드려보니 가능성이 보이긴 하네요.

 

그럼 다음 포스팅 기대해주세요.