JSer.info #510 - Babel 7.12.0 릴리스
TypeScript 4.1, Stage 2 proposal의 Class static blocks 지원.
import/export 이름을 변경된 ECMAScript에 맞춰 다룰 수 있도록 수정, Import assertions 파서를 @babel/syntax-import-assertions
플러그인으로 분할.
Chrome 87 beta 릴리스
DevTools에 CSS Grid 디버깅 도구, WebAuthn 탭 추가.
DevTools와 관련된 내용은 다음 기사를 참고.
카메라의 pan / tilt / zoom 지원, Cookie Store API를 기본적으로 활성화, cross-origin isolation 지원.
또, 입력 중인지 판단하는 isInputPending()
, Service Worker의 Range 요청, postMessage
로 전달할 수 있는 Transferable Streams 지원.
그 외로 Chrome 86에서 비권장됐던 FTP 지원이 87에서 기본적으로 비활성화(15% 사용자 대상) 됐다.
npm 7.0.0 릴리스
비호환 변경 사항으로peerDependencies
자동 설치, package-lock.json의 타입 변경, yarn.lock 지원, npm audit
의 출력 내용이 변경됐다.
또, npm exec
명령어가 추가됐으며 npx
명령어는 내부적으로 npm exec
명령어를 사용하도록 수정됐다.
추가된 기능으로서 Workspaces 지원, yarn의 resolusions
에 해당하는 acceptDependencies
기능 지원 등이 있다.
헤드라인
Release v5.1.0 · webpack/webpack
github.com/webpack/webpack/releases/tag/v5.1.0
webpack 5.1.0 릴리스
cleverMerge
, EntryOptionPlugin
, DynamicEntryPlugin
을 Public API로 변경.
try-catch 내에서 require
를 사용해 모듈의 유무를 판단할 때 발생하는 오류 수정.
7.12.0 Released: TypeScript 4.1, strings as import/export names, and class static blocks · Babel
babeljs.io/blog/2020/10/15/7.12.0
Babel 7.12.0 릴리스.
TypeScript 4.1 지원.
Stage 2 proposal의 Class static blocks 지원.
import/export 명을 변경된 ECMAScript에 맞춰 다룰 수 있도록 수정, Import assertions 파서를 플러그인으로 분리.
Node v14.14.0 (Current) | Node.js
nodejs.org/en/blog/release/v14.14.0/
Node v14.14.0 릴리스.
fs.rm
추가, res.setHeader
등에 헤더를 배열로 전달할 수 있도록 변경.
Chromium Blog: Chrome 87 Beta: WebAuthn in DevTools, Pan/Tilt/Zoom, Flow Relative Shorthands and More
blog.chromium.org/2020/10/chrome-87-beta-webauthn-in-devtools.html
Chrome 87 베타 릴리스.
DevTools에 WebAuthn 탭 추가, 카메라 pan / tilt / zoom 지원, cross-origin isolation 지원 개선.
또, isInputPending
과 Service Worker에서의 Range 요청 지원, postMessage
에서 전달할 수 있는 Transferable Streams 지원.
Presenting v7.0.0 of the npm CLI - The GitHub Blog
github.blog/2020-10-13-presenting-v7-0-0-of-the-npm-cli/
npm 7 릴리스.
비호환 변경 사항으로 peerDependencies 자동 설치, package-lock.json의 형식 변경, yarn.lock 지원, npm audit
의 출력 내용이 변경됐다.
기능 추가로서 Workspaces 지원, npm exec
추가 등이 이뤄졌다.
아티클
min(), max(), and clamp(): three logical CSS functions to use today
CSS의 min()
, max()
, clamp()
함수 소개.
GraphQL 기초 중 기초 - Qiita(일본어)
qiita.com/shotashimura/items/3f9e04b93e79592030a4
Node.js에서의 GraphQL API 서버 구현을 주제로 한 글.
Create TypeScript declarations from JavaScript and JSDoc - Human Who Codes
humanwhocodes.com/snippets/2020/10/create-typescript-declarations-from-javascript-jsdoc/
JSDoc에서 TypeScript의 타입 정의 파일을 생성하는 방법을 소개.
TypeScript의 출력 옵션에 emitDeclarationOnly
와 allowJs
를 포함하여 JSDoc에서 d.ts 파일을 생성할 수 있다.
Video processing with WebCodecs
Chrome 86에 Origin Trial으로 도입된 WebCodecs를 소개하는 글.
영상과 음성를 인코딩 및 디코딩 할 수 있는 API와 VideoTrackReader
, VideoEncoder
, VideoDecoder
를 다루고 있다.
소프트웨어, 도구, 라이브러리
Liaison – A love story between the frontend and the backend
백엔드, 프런트엔드를 포함한 풀스택 자바스크립트 프레임워크.
samizdatco/skia-canvas: A canvas environment for Node.js
github.com/samizdatco/skia-canvas
Skia를 사용해 개발한 Node.js 환경에서 동작하는 Canvas.
sciter – Multiplatform HTML/CSS UI Engine for Desktop and Mobile Application
앱 내 삽입할 목적으로 개발된 HTML / CSS 엔진
바이너리 크기가 작은 앱을 만들기 위한 프레임워크로, HTML / CSS 서브셋과 스크립트 엔진을 갖고있다.
MTG/essentia.js: JavaScript library for music/audio analysis and processing powered by WebAssembly
C++로 작성된 음성 / 음악 처리 라이브러리인 Essentia를 WebAssembly로 컴파일 한 자바스크립트 랩퍼 라이브러리.
TimvanScherpenzeel/detect-gpu: Classifies GPUs based on their 3D rendering benchmark score allowing the developer to provide sensible default settings for graphically intensive applications.
github.com/TimvanScherpenzeel/detect-gpu
WebGL을 기반으로 한 3D 렌더링 벤치마크 점수를 활용해 GPU를 판단, 분류하는 라이브러리.
도서
프런트엔드 개발 입문 프로페셔널 개발 도구와 설계 및 구현 | 아다치 료, 타케다 사토시 | 책 | 통신판매 | Amazon(일본어)
www.amazon.co.jp/dp/4798061778/
2020년 10월 9에 출간된 웹 프런트엔드와 에코시스템을 다룬 도서
accrefs - Web 접근성 참고 자료 정리(일본어)
웹 접근성과 관련된 자료를 정리한 페이지