ProseMirror 가이드 톹아보기 이전 글에서는 동시 편집을 지원하기 위한 프로토콜인 WebRTC와 WebSocket에 대해서 차이와 동작 방식을 짧게나마 알아봤다. 이번에는 WYSIWYG 리치 텍스트 에디터를 만들기 위한 도구와 개념들을 제공하는 ProseMirror를 알아보려고 한다. ProseMirror Guide ProseMirror Guidestrong "strong text with " em "emphasis"prosemirror.net ProseMirror는 현재 사내에서 사용하고 있는 협업 툴인 Jira에서도 텍스트 에디터로 사용되고 있다. 또한 예전부터 관심 있는 동시편집에 있어서 ProseMirror가 매우 좋은 성능을 발휘하고 있다고 알고 있어서  ProseMirror를 이 기회에 분석해야 겠다고 생각해 가이드 문서를..

2025. 3. 31.

개발

크로미움 브라우저에서 p 내부 span을 삭제할 때 span이 날아간다면 ? 오랜만에 사내에서 개발하고 있는 WYZYWIG 웹 에디터 관련 이슈를 처리하면서 브라우저 IME에 따른 버그가 있어 트러블 슈팅에 대해서 공유하고자 한다. 문제?아래와 같은 HTML을 사용자는 웹 에디터에서 편집하고자 한다.안녕하세요요즘 날씨가 많이 덥네요건강관리 잘 하세요~ 이 HTML은 아래와 같이 사용자에게 보일 것이다.만약 사용자가 빈 span 태그에 캐럿( 마우스를 클릭하면 깜빡이는 것 )을 위치한 채삭제(backspace/delete)를 눌렀다면 사용자가 기대하는 경험은 무엇일까 ?사용자는 빈 문단이 삭제되면서 아래에 있는 문단이 한 줄 올라오는 것을 기대할 것이다.하지만 여기서 사용자가 delete 키를 눌러 뒤의 문단을 계속적으로 삭제할 경우 어떻게 될까? 현재 Edge 브라우저 기준 ab..

2024. 8. 17.

개발