TOAST UI Monthly 2020년 9월호
벌써 올해의 끝이 보입니다. 올해는 유난히 시간이 빨리 지나간 것 같은데요. 다들 연초에 세운 계획은 많이 이루셨나요? 저는 늘 그랬듯 절반 이상은 남아있는데요. 😬 아직 3달이 남았으니 더는 미루지 말고 오늘부터 시작해보는 건 어떤가요? 그럼, 이제 이번 달 TOAST UI에 어떤 변화가 있는지 같이 살펴보도록 하겠습니다!
🚀 Releases
v2.4.0
기능 추가
- 프론트 매터(Front Matter) 지원 (#1711)
Jekyll에서 사용되던 프론트 매터를 에디터에서도 사용할 수 있게 되었습니다. frontMatter 옵션을 설정하면 문서 상단에 프론트 매터를 작성할 수 있습니다. 다음과 같이 프론트 매터 옵션을 사용하여 문서와 관련된 정보를 편집하고 저장할 수 있습니다. (단, 프론트 매터는 문서와 관련된 메타 데이터로 뷰어(프리뷰)에서는 보이지 않습니다)
const editor = new Editor({
frontMatter: true
});
- [마크다운] 테이블 구문에서 단축키(엔터, 탭) 사용 기능 추가 (#1126)
마크다운 에디터에서도 위지윅과 같이 테이블에서 탭 키를 사용하여 셀 포커스 이동을 할 수 있습니다. tab 키를 누르면 다음 셀로, shift + tab 키를 누르면 이전 셀로 커서가 이동됩니다. 또한 테이블 바디(<tbody />) 영역에서 enter 키를 누르면 새 행이 추가되는 기능이 추가되어 이전보다 편리하게 테이블 구문을 편집할 수 있습니다.
탭(tab, shift + tab) 키 동작
엔터(enter) 키 동작
- [뷰어] 커스텀 렌더러 사용 시 태스크 마커를 비활성화 할 수 있는 속성값 추가 (#1163)
customHTMLRenderer 옵션을 사용하면 원하는 형태의 HTML로 마크다운 구문을 렌더링 할 수 있습니다. 태스크 아이템에 data-te-task-disabled 속성값이 추가되었으며, 이 속성값을 설정하여 태스크 아이템을 비활성화(disabled)된 상태로 렌더링 할 수 있습니다. 뷰어에서 태스크 아이템의 마커(체크박스)의 클릭 이벤트를 막을 때 data-te-task-disabled 속성을 다음과 같이 추가하면 됩니다.
const viewer = Editor.factory({
el: document.querySelector('#viewer'),
initialValue: content,
viewer: true,
customHTMLRenderer: {
item(node, { entering, origin }) {
const result = origin();
if (entering) {
const { attributes = {}, classNames = [] } = result;
if (node.listData.task) {
attributes['data-te-task-disabled'] = ''; // for event
classNames.push('disabled'); // for style
}
return result;
}
return result;
}
}
});- 크로아티아어 지원 (#1162)
해외 컨트리뷰터(@hrvoj3e)의 도움을 받아 다국어 파일에 크로아티아어를 지원하게 되었습니다. 다국어 지원 기능은 에디터 외 셀 병합 플러그인(table-merged-cell)에서도 사용할 수 있습니다.
const editor = new Editor({
language: 'hr' // 또는 'hr-HR'
});버그 수정
plugin옵션에 셀 병합 플러그인 설정했을 시 잘못된 타입 추론 수정 (#1160)- [마크다운] 빈 라인이 포함된 텍스트를 펜스 코드 블럭 구문으로 감쌀 때 구문 강조가 잘못되는 문제 수정(#1167)
- [위지윅] MS Office에서 리스트를 복사, 붙여넣기 했을 때 서식이 깨지는 문제 수정 (#1153)
v4.15.1
버그 수정
- 커스텀 엘리먼트로 SVG 엘리먼트를 생성하는 경우, 클릭시 스크립트 에러가 발생하는 현상 수정 (#1173)
- 셀 값이
undefined,null값인 경우 자동으로 빈 문자열로 변경되던 현상을 원본 값을 유지하는 것으로 변경 (#1174)
v1.12.14
버그 수정
- 브라우저 비활성 탭에서 캘린더 requestAnimFrame 이벤트 콜백 문제 해결 (#603)
- 기본 생성 팝업 창에서 새 일정 추가 시 입력한 장소 정보가 저장되지 않는 문제 해결 (#615)
- 일정 수정 시
location,isReadOnly,attendees속성 반영 (#615, #645, #690) - 월간뷰 종일 일정 표시 오류 수정 (#642 ,#646, #662, #673)
👨💻 Next Features
위지윅 에디터에서 툴바를 통해 이미지에 링크를 걸 수 있는 기능이 추가되고 이미 생성된 링크 내용을 편집할 수 있도록 링크 관련 기능들이 개선될 예정입니다.
🗞 TOAST UI NEWS
이번 달 Weekly Picks
이번 위클리는 세 개의 번역 글이 올라왔습니다. 이번 달은 React에 관련된 글들이 많았는데요. Gatsby와 Next.js를 비교한 글부터 useEffect를 사용할 때 알아야 하는 네 가지 팁에 대해 소개한 글, Hook에 대해 필자의 어두운 시각을 작성한 글이 번역되었습니다. 아직 읽어보시지 않았다면 아래 링크를 클릭하세요! 👇👇
- 2020.09.08 기술 이야기: Gatsby가 Next.js와 1:1 대결에서 이겼다. #274
- 2020.09.16 리액트 useEffect: 개발자가 알아야 할 네가지 팁 #275
- 2020.09.22 React Hook의 어두운 면 #276
사용 문의, 기능 추가/수정 요청 및 버그 신고는 각 제품의 GitHub 저장소 이슈를 이용해주세요!