Fork me on GitHub

JavaScript의 최신 소식을 소개하는 주간 블로그

2020-08-18: Storybook 6.0.0, npm 7 beta, hapi 20(Maintainer 교체)

2020年08月18日 Translator: U-Yeong Ju Edit on GitHub See Revisions

JSer.info #501 - Storybook 6.0.0이 릴리스 됐습니다.

TypeScript를 빌트인 지원하며 스토리 함수 첫 번째 인수에 Args 객체를 전달하도록 개선됐고 addon-knobs를 대신하는 addon-controls가 도입됐습니다.
그리고 여러개의 Storybook을 하나의 Storybook으로 조합해서 살펴 볼 수 있도록 변경됐습니다.
새롭게 추가된 각 기능에 대한 글도 함께 공개 됐으니 살펴보시면 좋을 거 같습니다.

5.3에서 6.0으로의 이전 가이드와 이전 명령어(npx sb upgrade)도 공개 됐으니 참고해주세요.

npm 7 베타가 릴리스 됐습니다.

peerDependencies가 기본적으로 설치되도록 변경됐으며 이와 함께 npm 6의 방식도 지원하는 --legacy-peer-deps가 추가됐습니다.
npm 2까지는 peerDependencies를 자동으로 설치했지만, 3에서 peerDependencies를 기본적으로 설치하지 않도록 변경했습니다.

peerDependencies에 관한 yarn이나 pnpm의 정책은 다음 RFC 이슈에 정리돼 있으니 참고하시길 바랍니다.

새로운 기능으로는 acceptDependencies, workspaces 필드, yarn.lock을 지원하며 package-lock.json의 형식 변경이 이뤄졌습니다.
또, npm run-script에서 활용할 수 있는 npm_package_*와 npm_package_*의 환경 변수 삭제 또는 변경됐으니 참고하시길 바랍니다.

그 외로 npx 대신 사용할 수 있는 npm exec 명령어가 추가됐으며 npx는 npm exec의 별칭(alias)으로 변경될 예정입니다.

Node.js 웹 프레임워크인 hapi 20.0.0이 릴리스 됐습니다.

메이저 업데이트이지만 비호환적인 기능 변경은 없으며 단지 메인테이너가 에란 해머(Eran Hammer)에서 Technical Steering Committee(기술 개발에 대한 조정역할 및 포럼의 방향을 정립하는 위원회)로 인계되면서 발생한 변경 사항을 포함하고 있습니다.

경위는 다음 이슈에 잘 정리돼 있으며 상용 지원의 채산적인 문제와 모티베이션 문제로 hapi의 개발자인 에란 해머에 의한 유지보수를 금년부로 종료한다고 알려왔습니다.
이 문제와 함께 유지보수를 인수하기 위한 hapi Technical Steering Committee(TSC)가 설립됐고 20.0.0 부터는 TSC가 hapi의 메인테이너가 됩니다.

헤드라인

Release v6.0.0 · storybookjs/storybook

github.com/storybookjs/storybook/releases/tag/v6.0.0

JavaScript UI Tools ReleaseNote

Storybook 6.0.0이 릴리스 됐습니다.
TypeScript를 빌트인 지원하며 스토리 함수 첫 번째 인수에 Args 객체를 전달하도록 개선됐고 addon-knobs를 대신하는 addon-controls가 도입됐습니다.
여러개의 Storybook을 하나의 Storybook으로 조합해서 살펴 볼 수 있도록 변경 되는 등 많은 개선이 이뤄졌습니다.
또, 5.3에서 6.0으로의 이전 가이드도 공개 됐으니 참고하세요.

The npm Blog — npm v7 Series - Beta Release! And: SemVer-Major...

blog.npmjs.org/post/626173315965468672/npm-v7-series-beta-release-and-semver-major

npm ReleaseNote

npm 7 beta가 릴리스 됐습니다.
peerDependencies가 기본적으로 설치되도록 변경됐으며 이와 함께 npm 6의 방식도 지원하는 --legacy-peer-deps가 추가됐습니다.
새로운 기능으로는 acceptDependencies, workspaces 필드, yarn.lock을 지원하며 package-lock.json의 형식 변경이 이뤄졌습니다.
또, npm run-script에서 활용할 수 있는 npm_package_*와 npm_package_*의 환경 변수 삭제가 이뤄졌습니다.

Node v14.8.0 (Current) | Node.js

nodejs.org/en/blog/release/v14.8.0/

node.js ReleaseNote

Node.js 14.8.0이 릴리스 됐습니다.
Top-Level Await를 기본적으로 지원하며 async_hooks 모듈에 AsyncResource.bind가 추가됐습니다.

Release Version 8.0.0 · acornjs/acorn

github.com/acornjs/acorn/releases/tag/8.0.0

JavaScript ECMAScript library

JavaScript 파서 Acorn 8.0.0이 릴리스 됐습니다.
패키지를 ECMAScript module로 불러올 수 있도록 개선됐으며 ecmaVersion 옵션이 필수로 변경됐습니다.

Update for Customers Using PhoneGap and PhoneGap Build | by Adobe I/O | Aug, 2020 | PhoneGap

blog.phonegap.com/update-for-customers-using-phonegap-and-phonegap-build-cc701c77502c

JavaScript app news

웹 기술을 이용해 네이티브 애플리케이션을 만들 수 있는 PhoneGap 빌드 서비스가 2020년 10월에 종료됩니다.
대체재로 Apache Cordova, Ionic을 소개하고 있습니다.

20.0.0 Release Notes · Issue #4138 · hapijs/hapi

github.com/hapijs/hapi/issues/4138

node.js library ReleaseNote

hapi 20.0.0이 릴리스 됐습니다.
메인터넌스가 교체 돼 Technical Steering Committee(TSC) 기반 프로젝트로 변경됐습니다.
그 외로 @hapi/joi에서 @hapi/validate로 변경됐으며 Node.js 14를 지원합니다.

emscripten/ChangeLog.md at master · emscripten-core/emscripten

github.com/emscripten-core/emscripten/blob/master/ChangeLog.md#200-08102020

WebAssembly JavaScript library Tools ReleaseNote

C/C++ 등을 WebAssembly로 컴파일하는 Emscripten 2.0이 릴리스 됐습니다.
fastcomp backend 삭제하고 Python 2 지원이 종료됐습니다.
또, 예외 정보 메타 데이터를 JS가 아니라 WebAssembly.Memory에 보존하여 예외 처리가 쓰레드 세이프하도록 변경됐습니다.

Release 2.11.0 · qunitjs/qunit

github.com/qunitjs/qunit/releases/tag/2.11.0

JavaScript test library ReleaseNote

QUnit 2.11.0이 릴리스 됐습니다.
Node.js 10 미만 지원이 종료됐고 assert.true와 assert.false가 추가됐으며 HTML 보고서 검색 기능이 개선됐습니다.

Ajv Joins OpenJS Foundation as an Incubation Project - OpenJS Foundation

openjsf.org/blog/2020/08/14/ajv-joins-openjs-foundation-as-an-incubation-project/

JSON library news JavaScript

JSON Schema 검증 도구인 Ajv가 OpenJS Foundation에 들어갔습니다.

아티클

Node.js에서 프로토타입 오염 후 임의 코드를 실행하기 까지의 사례 - knqyf263's blog(일본어)

knqyf263.hatenablog.com/entry/2020/08/11/050342

JavaScript article security

Node.js에서의 프로토타입 오염 실사례를 소개하는 글입니다.

The Golden Rule of Generics

effectivetypescript.com/2020/08/12/generics-golden-rule/

TypeScript article

TypeScript의 Generics을 사용해야 하는지 판단할 때의 기준으로 「타입 매개변수는 두 번 표시돼야한다」라는 규칙에 대해 이야기합니다.
다양한 코드를 활용한 예와 함께 Generics 사용이 좋은 경우를 소개합니다.

Optimizing CSS for faster page loads - Tomas Pustelnik's personal website

pustelto.com/blog/optimizing-css-for-faster-page-loads/

CSS article performance

CSS의 Critical Path 최적화에 대해서 소개합니다.
CSS를 불러오는 타임에 미치는 영향, Critical CSS 분리와 지연 로드, CSS의 Code Splitting에 대해서 이야기합니다.

Node.js and the struggles of being an EventTarget

www.nearform.com/blog/node-js-and-the-struggles-of-being-an-eventtarget/

node.js article

Node.js에 EventTarget이 왜 필요하고 구현되는지 이야기합니다.
Node.js에 Fetch나 AbortController 등의 웹 표준 API를 구현하기 위해 브라우저와 호환성 있는 EventTarget API 필요한 점에 대해서 언급합니다.
EventTarget을 구현하는 과정에서 호환성, 다중 상속(multiple inheritance), 성능 문제를 어떻게 해결했는지에 대해서도 작성 돼 있습니다.

사이트, 서비스, 문서

twilco/kosmonaut: A web browser engine for the space age

github.com/twilco/kosmonaut

Rust browser

Servo에 영감을 받은 Rust 기반 브라우저 엔진입니다.

Shopify/web-foundation: Principles, decision logs, best practices, and common configuration for building web apps at Shopify

github.com/Shopify/web-foundation

document

Shopify가 웹 개발에 사용하는 설정과 각 설명 문서가 정리 돼 있는 저장소 입니다.

소프트웨어, 도구, 라이브러리

ealush/vest: Vest ✅ Declarative validations framework

github.com/ealush/vest

JavaScript library

테스트 프레임워크 스럽게 설계 된 검증 라이브러리입니다.
테스트 코드를 작성하는 느낌으로 검증 코드르 구현할 수 있습니다.

Run JavaScript Everywhere.

nodejs.dev/

node.js document

Node.js에 입문할 때 도움을 줄 수 있는 문서 사이트입니다.

Native mobile apps in JavaScript. Fast and secure framework. - Tabris

tabris.com/

JavaScript Native iOS Android library

React Native 처럼 JavaScript(JSX)로 OS 네이티브 UI를 개발 할 수 있는 모바일 앱 개발 프레임워크 입니다.

Pull Request to this article
JSer.info Slackに参加する