TOAST UI Monthly 2020년 12월호
벌써 2020년이 모두 지나갔습니다😭. 올 한해는 특히 지금까지의 삶과 다른 하루하루를 살았던 것 같은데요. 모두 긴 시간 동안 고생 많으셨고 내년에는 마스크 없는 일상을 기대하면서 집에서 가족들과 따뜻한 마무리 하셨으면 좋겠습니다. 그럼 시작해볼까요!🌝🌝
🚀 Releases
editor-plugin-table-merged-cell@1.3.1
버그 수정
- [WYSIWYG] 병합된 테이블 셀에 HTML 문자열이 포함된 경우 붙여넣기 한 테이블이 깨지는 현상 수정 (#1249)
TOAST UI Chart 4.0 Beta 배포
TOAST UI Chart 4.0을 미리 체험할 수 있는 Beta 버전이 배포되었습니다!🎉🎉 새로운 모습의 차트는 npm을 통해 지금 바로 체험해 볼 수 있습니다.
npm install @toast-ui/chart@4.0.0-beta.1또한, 여러 종류의 차트를 체험할 수 있는 스토리북과 여러 옵션을 체험할 수 있는 codesandbox를 공개했습니다.
- storybook: https://toastui-chart4-beta.netlify.app/
정식 배포하는 날까지 많은 관심 부탁드리겠습니다!
v4.16.1
기능 추가
- 디폴트 셀 렌더러를 위한 styles, attributes, classNames 옵션 추가 (#1242)
디폴트 렌더러에 간단한 스타일링을 할 수 있도록 옵션이 추가되었습니다. renderer 옵션의 하위 객체로 styles, attributes, classNames을 설정하면 디폴트 렌더러를 통해서도 간단한 스타일링 및 속성을 추가할 수 있습니다.
const columns = [
{
name: 'name',
renderer: {
styles: {
fontWeight: '500',
},
attributes: {
myCustom: 'my-custom',
title: (props) => `my ${props.value}`,
},
classNames: ['my-class'],
},
},
];
const grid = new Grid({
columns,
// ...
})버그 수정
- tui-pagination의 옵션 추가 (#1239)
- 트리 셀 편집 시 자식 셀이 펼쳐지는 현상 수정 (#1241)
기타
- tui-pagination과 tui-date-picker 의존성 버전 업데이트로 jquery 의존성 설치 제거 (#1239)
v3.11.0
기능 추가
- 객체의 resize, move에 대한 undo 기능 추가 (#358)
객체의 크기 변경, 옮기기 작업에 대한 undo 기능이 추가되었습니다. 크기 변경 후 undo를 하면 변경 이전의 크기로 돌아가며, 위치를 옮긴 후 undo를 하면 옮기기 이전 위치로 돌아갈 수 있습니다.
- fabric.js 버전 4.2.0으로 업데이트 (#461)
의존성 모듈인 fabric.js의 버전이 최신 버전인 4.2.0으로 업데이트되었습니다. 이에 따라 내부의 옵션명이 제거 및 변경되었으며 사파리 v14에서 크롭 기능이 수행되지 않던 버그가 수정되었습니다.
개선
- prettier 적용 (#493)
버그 수정
- 텍스트의 취소선이 동작하지 않는 버그 수정 (#453)
- 선 그리기 시 setBrush API가 동작하지 않는 버그 수정 (#409, #418)
- 아이콘 등록 후 undo/redo 시 등록 시의 크기로 복구되지 않던 버그 수정 (#74, #441)
v1.13.0
기능 추가
- 주간뷰 보조 타임존 설정 시 정확한 타임존 오프셋을 구하기 위해
timezone옵션 추가 #723
일광 절약 시간제(DST)를 사용하는 지역의 일정이 적절한 위치에 일정이 표시되도록 개선되었습니다. 또한, 새로 추가된 timezone 옵션을 통해 자바스크립트 표준 스펙 Intl.DateTimeFormat 을 기본으로 오프셋을 계산하도록 변경되었으며 offsetCalculator을 통해 직접 오프셋 계산을 관리할 수 있습니다. offsetCalculator 옵션을 사용한다면 js-joda 및 moment-timezone 같은 날짜 라이브러리를 사용할 수 있습니다.
기존(1.12.14 이하)의
timezones옵션은 deprecated 될 예정입니다.
const cal = new Calendar(el, {
...
timezone: {
zones: [
{
timezoneName: 'Asia/Seoul',
tooltip: 'Seoul',
displayLabel: 'GMT+09:00'
},
{
timezoneName: 'America/New_York',
tooltip: 'New York',
displayLabel: 'GMT-05:00'
},
],
offsetCalculator: function(timezone, timestamp){
// Date객체의 'getTimezoneOffset()' API의 반환값과 일치
// 예) +09:00 => -540, -04:00 => 240
return moment.tz.zone(timezone).utcOffset(timestamp);
},
}
});⚠️
timezone옵션을 사용한다면 Internet Explorer와 같이Intl.DateTimeFormat와formatToPart를 지원하지 않는 브라우저에서offsetCalculator를 지정하지 않았다면 폴리필을 추가해주세요.
버그 수정
- 시스템 로컬 설정이 DST가 적용되는 시간대를 사용하는 경우, 달력 인스턴스가 생성 시간에 따라 하계시/표준시 여부에 따라 일정이 다르게 표시되는 현상 해결 (#423, #671)
👨💻 Next Features
TOAST UI 에디터는 새해인 2021년 1분기에 3.0 출시를 목표로 열심히 개발 중이며, 다음과 같은 기능들이 개선되고 강화될 예정입니다.
- ProseMirror로 코어 에디터 모듈을 교체하여 WYSIWYG의 문서 편집 기능 강화
- 기본 제공 플러그인 기능 개선 및 TOC 같은 플러그인 추가 제공
- 커스텀 신택스 지원
- 디펜던시 제거로 보다 가벼운 에디터 제공
더 자세한 내용은 GitHub에 게시된 👉 로드맵 을 통해서 확인해 보세요! 👀
TOAST UI Chart 4.0 정식 배포
2021년 1월 셋째주 정식 배포를 목표로 최적화와 가이드 문서 보강 작업을 진행하고 있습니다. 많은 분들이 편리하게 사용할 수 있는 차트로 다가갈 예정이니 많은 관심 부탁드릴게요!
🗞 TOAST UI NEWS
이번 달 Weekly Picks
이번 위클리는 총 4개의 번역 글이 올라왔습니다. 먼저, 브라우저 페이지 이동 시 어떤 방식으로 최적화를 하는지와 주요 컨텐츠를 빠르게 렌더링하는 여러 가지 팁에 대해 번역되었습니다. 또한, 최신 자바스크립트 문법을 통한 배포 최적화 방법과 CSS를 통해 컨텐츠를 중앙 정렬시키는 여러 가지 방법에 대해서도 번역되었습니다. 아직 읽어보시지 않았다면 아래 링크를 클릭하세요! 👇👇
- 2020.12.01 이전/다음 페이지 캐시 #286
- 2020.12.10 LCP(Largest Contentful Paint) 최적화하기 #287
- 2020.12.16 더 빠른 애플리케이션을 위한 최신 자바스크립트 배포, 제공 및 설치 #288
- 2020.12.22 CSS로 중앙 정렬하기 #289
NHN FORWARD 2020
NHN의 개발 컨퍼런스 NHN FORWARD가 12월 14일~15일 온라인에서 성공적으로 진행되었습니다. FE 개발랩에서는 총 5개의 세션이 공개했으며, 발표 영상은 유튜브에 모두 업로드되었습니다. 모두 유익한 세션이었으니 아직 시청하지 못하신 분들은 아래 링크를 클릭하세요! 👇👇
-
프런트엔드 타임 존 뽀개기: 글로벌 서비스를 위한 타임 존 좌충우돌 개발기
-
오픈소스 메인테이너로 성장하기(feat.TOAST UI)
-
Welcome to JAMStack
-
천천히 읽어 보는 Chrome 개발자 도구 설명서
-
12K만큼 사랑하는 오픈 소스 에디터 개발 이야기
사용 문의, 기능 추가/수정 요청 및 버그 신고는 각 제품의 GitHub 저장소 이슈를 이용해주세요!