translate: 20231215 article

jser · Dec 17, 2023 · 0d0bbf7 · 0d0bbf7
1 parent 0217510
commit 0d0bbf7
Show file tree

Hide file tree

Showing 2 changed files with 241 additions and 2 deletions.
diff --git a/_i18n/ja/_posts/2023/2023-12-15-safari-17.2-deno-1.39webgpu-sveltekit-2.md b/_i18n/ja/_posts/2023/2023-12-15-safari-17.2-deno-1.39webgpu-sveltekit-2.md
@@ -34,7 +34,7 @@ Deno 1.39がリリースされました。
 - [Deno 1.39: The Return of WebGPU](https://deno.com/blog/v1.39)
 
 WebGPU APIを再導入、`deno coverage --html`でHTMLのカバレッジレポートを表示できるように、`deno compile`の改善が含まれています。
-`deno taak`で`node_modules/.bin/`へのPATHを通すように、`Object.prototype.__proto__`を有効化する`--unstable-unsafe-proto`フラグが追加されています。
+`deno task`で`node_modules/.bin/`へのPATHを通すように、`Object.prototype.__proto__`を有効化する`--unstable-unsafe-proto`フラグが追加されています。
 その他には、Jestのexpect互換の`std/expect`を追加、コマンドライン引数のパースをする`std/cli`を追加などの変更も含まれています。
 
 ----
@@ -107,7 +107,7 @@ ESLintと同じようにJavaScriptやTypeScriptのLintをするツール。
 
 Deno v1.39リリース。
 WebGPU APIを再導入、`deno coverage --html`でHTMLのカバレッジレポートを表示できるように、`deno compile`の改善。
-`deno taak`で`node_modules/.bin/`へのPATHを通すように。
+`deno task`で`node_modules/.bin/`へのPATHを通すように。
 `Object.prototype.__proto__`を有効化する`--unstable-unsafe-proto`フラグを追加。
 Jestのexpect互換の`std/expect`を追加、コマンドライン引数のパースをする`std/cli`を追加など
 

diff --git a/_i18n/ko/_posts/2023/2023-12-15-safari-17.2-deno-1.39webgpu-sveltekit-2.md b/_i18n/ko/_posts/2023/2023-12-15-safari-17.2-deno-1.39webgpu-sveltekit-2.md
@@ -0,0 +1,239 @@
+---
+title: "2023-12-15: Safari 17.2, Deno 1.39(WebGPU), SvelteKit 2"
+author: "azu"
+translator: rewrite0w0
+layout: post
+date: 2023-12-15T04:59:54.932Z
+category: JSer
+tags:
+- Next.js
+- React
+- debug
+- python
+- book
+
+---
+
+JSer.info #673 - Safari 17.2가 출시되었어요.
+
+- [WebKit Features in Safari 17.2 | WebKit](https://www.webkit.org/blog/14787/webkit-features-in-safari-17-2/)
+
+여러 변경이 있어요.
+
+- HTML, `<detail name>` 지원, `<input autocomplete="one-time-code">` 지원
+- CSS, Nesting 규칙 완화, `cap` unit, `rem()`/`mod()`/`round()` 추가, `mask-border` 지원, Custom Highlight API 지원
+- JavaScript, Import attributes 지원
+
+그 외, `<link rel=preload>`에서 `imagesizes`/`imagesrcset` 속성으로 responsive image 지원.
+SVG 이미지, `<image crossorigin>`로 읽을 때 CORS 고려해서 다루도록 됨, 
+Fetch Priority 지원, HTML Form의 `form.reportValidity()` API 지원도 있어요.
+
+----
+
+Deno 1.39가 출시되었어요.
+
+- [Deno 1.39: The Return of WebGPU](https://deno.com/blog/v1.39)
+
+WebGPU API 재도입, `deno coverage --html`에서 HTML 커버리지 리포트 보이도록, `deno compile` 개선.
+`deno task`에서 `node_modules/.bin/`으로 PATH 사용하도록, `Object.prototype.__proto__`를 유효화하는 `--unstable-unsafe-proto` 플래그 추가.
+그 외, Jest의 expect 호환 `std/expect` 추가, 커맨드라인 인수 파싱하는 `std/cli` 추가.
+
+----
+
+SvelteKit 2가 출시되었어요.
+
+- [Announcing SvelteKit 2](https://svelte.dev/blog/sveltekit-2)
+
+`load` 함수에서 Promises 다룰 때 일관성 갖도록, `paths.relative` 기본값 `true`, `dangerZone.trackServerFetches` 삭제.
+
+다음 커맨드 라인으로 이행 가능, 이행 가이드도 공개.
+
+```
+$ npx svelte-migrate sveltekit-2
+```
+
+- [Migrating to SvelteKit v2 • Docs • SvelteKit](https://kit.svelte.dev/docs/migrating-to-sveltekit-2)
+
+
+
+----
+
+{% include inline-support.html %}
+
+----
+
+<h1 class="site-genre">헤드라인</h1>
+
+----
+
+## ECMAScript proposal updates @ 2023-11 | ECMAScript Daily
+[ecmascript-daily.github.io/ecmascript/2023/12/10/ecmascript-proposal-update](https://ecmascript-daily.github.io/ecmascript/2023/12/10/ecmascript-proposal-update "ECMAScript proposal updates @ 2023-11 | ECMAScript Daily")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">ECMAScript</span> <span class="jser-tag">proposal</span> <span class="jser-tag">news</span></p>
+
+2023-11 TC39 미팅에서 ECMAScript Proposal 상태 변경 모음.
+Array Grouping와 `Promise.withResolvers`가 Stage 4 되어서 ES2024에 포함.
+
+
+----
+
+## WebKit Features in Safari 17.2 | WebKit
+[www.webkit.org/blog/14787/webkit-features-in-safari-17-2/](https://www.webkit.org/blog/14787/webkit-features-in-safari-17-2/ "WebKit Features in Safari 17.2 | WebKit")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">safari</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Safari 17.2 출시.
+HTML, `<detail name>` 지원, `<input autocomplete="one-time-code">` 지원.
+CSS, Nesting 규칙 완화, `cap` unit, `rem()`/`mod()`/`round()` 추가, `mask-border` 지원, Custom Highlight API 지원.
+JavaScriptでは, Import attributes 지원.
+그 외, `<link rel=preload>`에서 `imagesizes`/`imagesrcset` 속성으로 responsive image 지원.
+SVG 이미지를 `<image crossorigin>`에서 읽을 때 CORS 고려해서 다룸.
+Fetch Priority 지원, HTML Form의 `form.reportValidity()` API 지원
+
+
+----
+
+## Oxlint General Availability | The JavaScript Oxidation Compiler
+[oxc-project.github.io/blog/2023-12-12-announcing-oxlint.html](https://oxc-project.github.io/blog/2023-12-12-announcing-oxlint.html "Oxlint General Availability | The JavaScript Oxidation Compiler")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">ESLint</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">Rust</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Oxlint 공개.
+ESLint와 같은 JavaScript, TypeScript Lint 도구.
+좋은 성능 목표로 설계했으며, 여러 ESLint 규칙을 코어에 포함.
+
+
+----
+
+## Deno 1.39: The Return of WebGPU
+[deno.com/blog/v1.39](https://deno.com/blog/v1.39 "Deno 1.39: The Return of WebGPU")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">deno</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Deno v1.39 출시.
+WebGPU API 재도입, `deno coverage --html`에서 HTML 커버리지 리포트 보이도록, `deno compile` 개선.
+`deno task`에서 `node_modules/.bin/`으로 PATH 사용하도록.
+`Object.prototype.__proto__` 유효화하는 `--unstable-unsafe-proto` 플래그 추가.
+Jest의 expect 호환 `std/expect` 추가, 커맨드라인 인수 파싱하는 `std/cli` 추가
+
+
+----
+
+## Announcing SvelteKit 2
+[svelte.dev/blog/sveltekit-2](https://svelte.dev/blog/sveltekit-2 "Announcing SvelteKit 2")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Svelte</span> <span class="jser-tag">ReleaseNote</span></p>
+
+SvelteKit 2 출시.
+`load` 함수에서 Promises 일관성있게 다루도록, `paths.relative` 기본값 `true`로 변경, `dangerZone.trackServerFetches` 삭제
+
+- [Migrating to SvelteKit v2 • Docs • SvelteKit](https://kit.svelte.dev/docs/migrating-to-sveltekit-2 "Migrating to SvelteKit v2 • Docs • SvelteKit")
+- [Release @sveltejs/kit@2.0.0 · sveltejs/kit](https://github.com/sveltejs/kit/releases/tag/%40sveltejs%2Fkit%402.0.0 "Release @sveltejs/[email protected] · sveltejs/kit")
+
+----
+<h1 class="site-genre">읽을거리</h1>
+
+----
+
+## npm install --production 같은게 너무 많은 문제
+[zenn.dev/zawa\_kyo/articles/d671e0935ae0c0](https://zenn.dev/zawa_kyo/articles/d671e0935ae0c0 "npm install --production 같은게 너무 많은 문제")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">npm</span> <span class="jser-tag">article</span></p>
+
+`npm install --omit=dev`이나 `--production`, `--inculde` 플래그 관련하여
+
+
+----
+
+## Vite는 사용하지 않았지만 Jest를 Vitest로 이행하기
+[zenn.dev/sa2knight/articles/migrating\_vitest\_from\_jest](https://zenn.dev/sa2knight/articles/migrating_vitest_from_jest "Vite는 사용하지 않았지만 Jest를 Vitest로 이행하기")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">testing</span> <span class="jser-tag">article</span></p>
+
+Jest에서 Vitest로 이행하는 방법에 대하여
+
+
+----
+
+## Baseline&#039;s evolution on MDN | MDN Blog
+[developer.mozilla.org/en-US/blog/baseline-evolution-on-mdn/](https://developer.mozilla.org/en-US/blog/baseline-evolution-on-mdn/ "Baseline&#039;s evolution on MDN | MDN Blog")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">article</span> <span class="jser-tag">browser</span></p>
+
+주요 브라우저에서 지원되는가 알기 쉽게 보이는 Baseline에 대해.
+MDN나 caniuse에서의 API 지원 현황 게시에 이용되고 있는 Baseline 정의에 대하여
+
+- [Baseline 2023  |  web.dev](https://web.dev/blog/baseline2023?hl=en "Baseline 2023  |  web.dev")
+
+----
+
+## Storybook for React Server Components
+[storybook.js.org/blog/storybook-react-server-components/](https://storybook.js.org/blog/storybook-react-server-components/ "Storybook for React Server Components")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">debug</span> <span class="jser-tag">article</span></p>
+
+Storybook의 React Server Components(RSC) 지원에 대하여.
+RSC을 클라이언트 사이드에서 렌더링해서 대응 예정. Storybook 8의 α버전에서 이용 가능하도록.
+
+----
+
+## 【월간 9000만 PV의 PR TIMES】프레스 페이지를 Next.js 이행하며 한 것들 | PR TIMES 개발자 블로그
+[developers.prtimes.jp/2023/12/13/replace-press-release-page-with-nextjs/](https://developers.prtimes.jp/2023/12/13/replace-press-release-page-with-nextjs/ "【월간 9000만 PV의 PR TIMES】프레스 페이지를 Next.js 이행하며 한 것들 | PR TIMES 개발자 블로그")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">article</span></p>
+
+Next.js의 Pages Router로 이행, 캐시 처리는 CDN(Fastly)에 의존.
+
+----
+
+## 1년에 걸쳐 Next.js의 app router으로 완전 이행한 이야기
+[zenn.dev/urotea/articles/3fbaa77d77b788](https://zenn.dev/urotea/articles/3fbaa77d77b788 "1년에 걸쳐 Next.js의 app router으로 완전 이행한 이야기")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">GraphQL</span> <span class="jser-tag">article</span></p>
+
+Next.js의 Pages Router에서 App Router으로의 이행에 대해.
+이행 순서, App Router으로 이행 후 장단점.
+Intercepting Routes에서의 dialog 관리, layout이나 에러 화면 관리, 캐시 문제에 관하여
+
+
+----
+
+## 잇큐 레스토랑을 Next.js App Router에서 Remix로 환승한 이야기 - 一休.com Developers Blog
+[user-first.ikyu.co.jp/entry/2023/12/15/093427](https://user-first.ikyu.co.jp/entry/2023/12/15/093427 "잇큐 레스토랑을 Next.js App Router에서 Remix로 환승한 이야기 - 一休.com Developers Blog")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">Remix</span> <span class="jser-tag">article</span></p>
+
+Next.js의 App Router에서 Remix Run으로 이행한 이야기.
+Next.js의 App Router에는 Cache-Control를 암묵적으로 변경할 수 없는 문제, Remix에는 Response를 자유롭게 변경 가능한 차이에 대해.
+
+
+----
+<h1 class="site-genre">웹사이트, 서비스, 문서</h1>
+
+----
+
+## BuilderIO/hydration-overlay: Overlay for hydration errors with explicit diff between renders.
+[github.com/BuilderIO/hydration-overlay](https://github.com/BuilderIO/hydration-overlay "BuilderIO/hydration-overlay: Overlay for hydration errors with explicit diff between renders.")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">debug</span> <span class="jser-tag">library</span></p>
+
+React의 Hydration에서 mismatch 에러를 Diff로 보이도록 하는 라이브러리.
+SSR와 CSR 렌더링 결과에 차이가 있는 경우 Hydration 에러의 디버그 이용 가능.
+
+- [Announcing React Hydration Overlay - Easily Squash Hydration Errors](https://www.builder.io/blog/announcing-react-hydration-overlay "Announcing React Hydration Overlay - Easily Squash Hydration Errors")
+
+----
+<h1 class="site-genre">소프트웨어, 도구, 라이브러리</h1>
+
+----
+
+## Onyx Programming Language
+[onyxlang.io/](https://onyxlang.io/ "Onyx Programming Language")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">WebAssembly</span> <span class="jser-tag">program</span></p>
+
+WebAssembly으로 컴파일 가능한 언어
+
+- [Onyx, a new programming language powered by WebAssembly](https://wasmer.io/posts/onyxlang-powered-by-wasmer "Onyx, a new programming language powered by WebAssembly")
+
+----
+<h1 class="site-genre">도서</h1>
+
+----
+
+## 구현으로 한큐에 풀스택 Web 개발 엔지니어 시야와 지식을 넓히는 핸즈온 | 주식회사 오픈톤
+[www.amazon.co.jp/dp/4798179337/](https://www.amazon.co.jp/dp/4798179337/ "구현으로 한큐에 풀스택 Web 개발 엔지니어 시야와 지식을 넓히는 핸즈온 | 주식회사 오픈톤")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">React</span> <span class="jser-tag">python</span> <span class="jser-tag">book</span></p>
+
+2023년 12월 18일 발매
+Next.js와 Django에서 웹 개발 대한 도서.
+샘플 애플리케이션을 통해 웹시스템 개발을 배우는 도서
+
+
+----