JSer.info #539 - CSS 프레임워크 Bootstrap 5 릴리스.

Bootstrap 5 | Bootstrap Blog

Bootstrap 5에서는 IE 지원을 종료하고 jQuery를 의존하지 않도록 재작성됐다.
offcanvas 컴포넌트, card의 아코디언을 대체하는 새로운 accordion 컴포넌트가 추가됐다.
또, Form과 Layout 변경, RTL 지원, Sass의 Utility API도 추가됐다.

v4에서의 마이그레이션 방법은 다음 문서에 정리돼 있다.

Migrating to v5 · Bootstrap v5.0

Underscore.js 1.13 릴리스.

Underscore.js 1.13.0

Underscore.js 1.13에서는 package.json의 exports 필드에 대응하며 ECMAScript Modules를 지원한다.

또, Underscore.js 1.12에서는 lodash 4.17.21에서 수정된 _.template의 취약점도 수정됐다.

Command Injection in lodash | Snyk

이와 경우는 별로 없을 것이라고 생각하지만 Underscore와 Lodash 모두 _.template의 variable 옵션에 임의의 문자열을 전달할 경우에 전달한 문자열을 코드로 실행할 수 있는 취약점이 있었다.

const _ = require('underscore');
const template = _.template('hello: <%= name %>', { variable: '여기에 임의 코드 문자열을 전달할 수 있다는 취약점' });
template({ name: 'Mustache' });

Prettier 2.3 릴리스.

Prettier 2.3. In which assignments are consistent, short keys non-breaking, and Handlebars official · Prettier

새로운 JavaScript 포메터(Ember / Handlebars) 추가, Handlebars 지원을 alpha에서 release로 변경, JSON5 / JSON 포멧이 수정됐다.
JavaScript의 변수 및 프로퍼티 대입 코드가 일관성 있게 정책이 수정됐으므로 업데이트 시 큰 Diif가 발생할 수 있다. 그 외에 GraphQL, MD, YAML 관련 프리티어 정책이 변경돼 Diff가 발생한다.

헤드라인

Bootstrap 5 | Bootstrap Blog

blog.getbootstrap.com/2021/05/05/bootstrap-5/

CSS library ReleaseNote JavaScript

Bootstrap 5 릴리스.
IE 지원 종료, jQuery 삭제.
offcanvas 컴포넌트, card 대체 accordion 컴포넌트 추가.
Form와 Layout 변경, RTL 지원, Sass의 Utility API 추가.

Migrating to v5 · Bootstrap v5.0

Underscore.js

underscorejs.org/#1.13.0

JavaScript library ReleaseNote

underscore 1.13.0 릴리스.
ECMAScript Modules 지원,
1.12.1에서는 _.template의 variable 옵션을 경우해 Code Injection이 가능한 취약점이 수정됐다.

Prettier 2.3. In which assignments are consistent, short keys non-breaking, and Handlebars official · Prettier

prettier.io/blog/2021/05/09/2.3.0.html

JavaScript Tools ReleaseNote

Prettier 2.3 릴리스.
JavaScript 포메터 정책이 크게 변경됨.
Handlebars 지원을 alpha에서 release로 변경, JSON5 / JSON 포멧 수정.

아티클

How we use Web Components at GitHub - The GitHub Blog

github.blog/2021-05-04-how-we-use-web-components-at-github/

WebComponents Github JavaScript article

GitHub의 Web Components를 주제로 한 글.
Rails ViewComponent와 Catalyst를 사용한 Web Components 구성, GitHub Elements 공개.

github/github-elements: GitHub's Web Component collection.

리소스 로드를 돕는 웹 브라우저 API의 세계(일본어)

nhiroki.jp/2021/05/06/resource-loading-apis

browser WebPlatformAPI article

미리 가져오기 및 로드 순서 등 웹 브라우저에서의 리소스 로드의 Hint API와 구조를 소개한다.

Hello, Modules!. JavaScript Modules, also known as ESM… | by Sindre Sorhus | May, 2021 | 🦄 Sindre Sorhus’ blog

blog.sindresorhus.com/hello-modules-d1010b4e777b

ECMAScript node.js article

Node.js 10 지원이 종료됨으로써 ESM으로의 이전을 어떻게 할지를 주제로 한 글
ESM의 장점, 패키지 유지보수 용 이전 가이드.

A Guide To Newly Supported, Modern CSS Pseudo-Class Selectors — Smashing Magazine

www.smashingmagazine.com/2021/04/guide-supported-modern-css-pseudo-class-selectors/

CSS article

CSS로 활용할 수 있는 최신 의사 클래스 소개.
임의의 a에 매치하는 :any-link, 포커스 돼 있는 요소를 다루는 :focus-visible과 :focus-within, 셀렉터를 다루는 :is()와 where()와 :has(), :empty 등.