-
-
Notifications
You must be signed in to change notification settings - Fork 71
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
translate: 2024-09-09 article (#1221)
- Loading branch information
1 parent
53bafd6
commit ea6bfb7
Showing
1 changed file
with
195 additions
and
0 deletions.
There are no files selected for viewing
195 changes: 195 additions & 0 deletions
195
_i18n/ko/_posts/2024/2024-09-09-vue-3.5-jsprimer-v6-a11y-visualizer.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,195 @@ | ||
--- | ||
title: "2024-09-09: Vue 3.5, jsprimer v6, a11y-visualizer" | ||
author: "azu" | ||
translator: rewrite0w0 | ||
layout: post | ||
date: 2024-09-09T00:48:44.816Z | ||
category: JSer | ||
tags: | ||
- nodejs | ||
- Firefox | ||
- ECMAScript | ||
- book | ||
- Vue | ||
|
||
--- | ||
|
||
JSer.info #706 - Vue 3.5가 출시되었어요. | ||
|
||
- [Announcing Vue 3.5 | The Vue Point](https://blog.vuejs.org/posts/vue-3-5) | ||
|
||
퍼포먼스 개선, `defineProps` 반환 값을 Destructure 가능해요. | ||
또한, `useId()` 추가, `data-allow-mismatch` 속성 추가, `defineCustomElement()` API 추가해 Custom Element 개선, `useTemplateRef()`, `onWatcherCleanup()` 추가도 있어요. | ||
|
||
---- | ||
|
||
JavaScript 입문서 [jsprimer](https://jsprimer.net/) v6.0.0가 출시되었어요. | ||
|
||
- [JavaScript Primer v6.0.0 출시: ES2024 대응과 Node.js 유스케이스 업데이트 | Web Scratch](https://efcl.info/2024/09/02/jsprimer-v6/) | ||
|
||
ES2024 대응과 Node.js 유스케이스 페이지가 업데이트되었어요. | ||
ECMAScript 관련해 `Map.groupBy`/`Object.groupBy`, ECMAScript Proposal Stage 2.7 대응이 있어요. | ||
그리고, Node.js에는 표준 모듈로 추가된 `node:util`의 `parseArgs`, `node:test` 관련한 변경도 있어요. | ||
|
||
---- | ||
|
||
[Accessibility Visualizer Browser Extension](https://github.com/ymrl/a11y-visualizer) 웹 접근성 디버깅 보조하는 브라우저 확장 기능이 공개되었어요. | ||
|
||
- [ymrl/a11y-visualizer: A Browser Extension for Enhanced Web Accessibility Checking](https://github.com/ymrl/a11y-visualizer) | ||
- [HTML 직접 읽지 않거나, 스크린 리더 사용하지 않고도, 접근성 향상시킬 수는 없을까(라는 생각으로 브라우저 확장 기능을 만드는 중)](https://zenn.dev/ymrl/articles/761efe95091798) | ||
|
||
a11y-visualizer은, 이미지 alt나 구획 제목 레벨을 시각화해서, 접근성 문제를 발견하기 쉽도록 했어요. | ||
|
||
---- | ||
|
||
{% include inline-support.html %} | ||
|
||
---- | ||
|
||
<h1 class="site-genre">헤드라인</h1> | ||
|
||
---- | ||
|
||
## JavaScript Primer v6.0.0 출시: ES2024 대응과 Node.js 유스케이스 업데이트 | Web Scratch | ||
[efcl.info/2024/09/02/jsprimer-v6/](https://efcl.info/2024/09/02/jsprimer-v6/ "JavaScript Primer v6.0.0 출시: ES2024 대응과 Node.js 유스케이스 업데이트 | Web Scratch") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">ReleaseNote</span> <span class="jser-tag">book</span></p> | ||
|
||
JavaScript Primer v6 출시. | ||
ECMAScript 2024 대응과 Node.js 표준 모듈 추가에 대응한 업데이트. | ||
`Map.groupBy`/`Object.groupBy`, ECMAScript Proposal Stage 2.7, `node:util`의 `parseArgs`, `node:test` 대응 | ||
|
||
|
||
---- | ||
|
||
## Release v9.0.0 · faker-js/faker | ||
[github.com/faker-js/faker/releases/tag/v9.0.0](https://github.com/faker-js/faker/releases/tag/v9.0.0 "Release v9.0.0 · faker-js/faker") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
Node.js Faker v9.0.0 출시. | ||
Node.js 14,16 지원 종료, locale 째로 import 가능, RNG의 seed 다루기 변경, 비권장 API 삭제 | ||
|
||
- [Upgrading to v9 | Faker](https://v9.fakerjs.dev/guide/upgrading.html "Upgrading to v9 | Faker") | ||
|
||
---- | ||
|
||
## Node.js — Node v22.8.0 (Current) | ||
[nodejs.org/en/blog/release/v22.8.0](https://nodejs.org/en/blog/release/v22.8.0 "Node.js — Node v22.8.0 (Current)") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
Node.js v22.8.0 출시. | ||
`module.enableCompileCache()` API 추가, `vm.createContext()`에 `vm.constants.DONT_CONTEXTIFY` 추가. | ||
커버리지가 특정 임계값 충족하도록 요구하는 기능 `--experimental-test-coverage` 플래그 추가 | ||
|
||
|
||
---- | ||
|
||
## Announcing Vue 3.5 | The Vue Point | ||
[blog.vuejs.org/posts/vue-3-5](https://blog.vuejs.org/posts/vue-3-5 "Announcing Vue 3.5 | The Vue Point") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Vue</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
Vue 3.5 출시. | ||
퍼포먼스 개선, `defineProps` 반환값을 Destructure 가능, `useId()` 추가, `data-allow-mismatch` 속성 추가. | ||
`defineCustomElement()` API 추가해 Custom Element 대응 개선, `useTemplateRef()`, `onWatcherCleanup()` 추가 | ||
|
||
|
||
---- | ||
|
||
## Firefox 130.0, See All New Features, Updates and Fixes | ||
[www.mozilla.org/en-US/firefox/130.0/releasenotes/](https://www.mozilla.org/en-US/firefox/130.0/releasenotes/ "Firefox 130.0, See All New Features, Updates and Fixes") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Firefox</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
Firefox 130 출시. | ||
`<details name>` 대응, X25519 digital signature algorithm 지원, Web Codecs API 지원. | ||
실험적 기능으로 `requestVideoFrameCallback()`, `ReportingObserver`에서 CSP 위반 감시 가능함 | ||
|
||
- [Firefox 130 for developers - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/130 "Firefox 130 for developers - Mozilla | MDN") | ||
|
||
---- | ||
|
||
## Release v1.47.0 · microsoft/playwright | ||
[github.com/microsoft/playwright/releases/tag/v1.47.0](https://github.com/microsoft/playwright/releases/tag/v1.47.0 "Release v1.47.0 · microsoft/playwright") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">playwright</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
playwright v1.47.0 출시. | ||
Network Tab 개선, `--tsconfig` 플래그 추가, Playwright Image를 Ubuntu 24.04 기반으로 변경 | ||
|
||
|
||
---- | ||
|
||
## ESLint v9.10.0 released - ESLint - Pluggable JavaScript Linter | ||
[eslint.org/blog/2024/09/eslint-v9.10.0-released/](https://eslint.org/blog/2024/09/eslint-v9.10.0-released/ "ESLint v9.10.0 released - ESLint - Pluggable JavaScript Linter") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">ESLint</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
ESLint v9.10.0 출시. | ||
`eslint` 패키지에 `@types/eslint`와 같은 자료형 정의 파일 포함하도록 변경 | ||
|
||
|
||
---- | ||
|
||
## Bun v1.1.27 | Bun Blog | ||
[bun.sh/blog/bun-v1.1.27](https://bun.sh/blog/bun-v1.1.27 "Bun v1.1.27 | Bun Blog") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">bum</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
Bun v1.1.27 출시. | ||
`node:zlib` 퍼포먼스 개선, `npm pack` 같은 처리하는 `bun pm pack` 명령어 추가. | ||
`Bun.serve()`에 Static routes 추가, `--max-http-header-size` 플래그 추가 | ||
|
||
|
||
---- | ||
|
||
## Release v8.0.0 · redwoodjs/redwood | ||
[github.com/redwoodjs/redwood/releases/tag/v8.0.0](https://github.com/redwoodjs/redwood/releases/tag/v8.0.0 "Release v8.0.0 · redwoodjs/redwood") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
||
Redwood v8.0.0 출시. | ||
Background Job 대응, SSR와 RSC 대응 개선, Storybook에 Vite 사용 가능, Docker 지원 | ||
|
||
- [Upgrade Guide](https://redwoodjs.com/upgrade/v8 "Upgrade Guide") | ||
|
||
---- | ||
<h1 class="site-genre">읽을거리</h1> | ||
|
||
---- | ||
|
||
## JS Dates Are About to Be Fixed | TimeTime | ||
[docs.timetime.in/blog/js-dates-finally-fixed/](https://docs.timetime.in/blog/js-dates-finally-fixed/ "JS Dates Are About to Be Fixed | TimeTime") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">ECMAScript</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span></p> | ||
|
||
ECMAScript Proposal Stage 3의 Temporal API 관련하여 | ||
|
||
|
||
---- | ||
|
||
## What’s new in React 19 – Vercel | ||
[vercel.com/blog/whats-new-in-react-19](https://vercel.com/blog/whats-new-in-react-19 "What’s new in React 19 – Vercel") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">article</span></p> | ||
|
||
React 19 새로운 기능 소개. | ||
Server Component, Server Action, `useActionState`/`useFormState`/`useOptimistic`/`use` 새로운 Hooks. | ||
리소스 preload, `ref` callback, `<title>` 메타데이터에 대응. | ||
Custom Element 대응, 에러 표시 개선 | ||
|
||
|
||
---- | ||
|
||
## The Ultimate Guide to Font Performance Optimization | DebugBear | ||
[www.debugbear.com/blog/website-font-performance](https://www.debugbear.com/blog/website-font-performance "The Ultimate Guide to Font Performance Optimization | DebugBear") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">article</span> <span class="jser-tag">fonts</span> <span class="jser-tag">performance</span></p> | ||
|
||
WebFont 퍼포먼스 최적화 관련하여 | ||
|
||
|
||
---- | ||
<h1 class="site-genre">웹사이트, 서비스, 문서</h1> | ||
|
||
---- | ||
|
||
## ymrl/a11y-visualizer: A Browser Extension for Enhanced Web Accessibility Checking | ||
[github.com/ymrl/a11y-visualizer?tab=readme-ov-file](https://github.com/ymrl/a11y-visualizer?tab=readme-ov-file "ymrl/a11y-visualizer: A Browser Extension for Enhanced Web Accessibility Checking") | ||
<p class="jser-tags jser-tag-icon"><span class="jser-tag">accessibility</span> <span class="jser-tag">Firefox</span> <span class="jser-tag">Chrome</span> <span class="jser-tag">Extension</span></p> | ||
|
||
접근성 정보를 시각적으로 표시하는 브라우저 확장. | ||
접근성 구조를 시각화해서, 쉽게 문제를 발견하는 도구 | ||
|
||
|
||
---- |