Skip to content

Commit

Permalink
2024-04-11のJS: zx 8.0.0、ESLint 9.0.0、Flowのcomponent構文 (#1182)
Browse files Browse the repository at this point in the history
* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update 688 draft

* Update _i18n/ja/_posts/2024/2024-04-11-zx-8.0.0-eslint-9.0.0-flowcomponent.md

* Delete _i18n/ja/_posts/2024/2024-04-11-688draft.md

* Update _i18n/ja/_posts/2024/2024-04-11-zx-8.0.0-eslint-9.0.0-flowcomponent.md

* Update 2024-04-11-zx-8.0.0-eslint-9.0.0-flowcomponent.md

* Update _i18n/ja/_posts/2024/2024-04-11-zx-8.0.0-eslint-9.0.0-flowcomponent.md

* Update _i18n/ja/_posts/2024/2024-04-11-zx-8.0.0-eslint-9.0.0-flowcomponent.md

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
  • Loading branch information
azu and github-actions[bot] authored Apr 11, 2024
1 parent bb3c5d0 commit 8fa4612
Showing 1 changed file with 203 additions and 0 deletions.
203 changes: 203 additions & 0 deletions _i18n/ja/_posts/2024/2024-04-11-zx-8.0.0-eslint-9.0.0-flowcomponent.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,203 @@
---
title: "2024-04-11のJS: zx 8.0.0、ESLint 9.0.0、Flowの`component`構文"
author: "azu"
layout: post
date: 2024-04-11T02:42:24.346Z
category: JSer
tags:
- React
- Next.js
- nodejs
- flowtype
- ShellScript

---

JSer.info #688 - zx 8.0.0がリリースされました。

- [Release 8.0.0 · google/zx](https://github.com/google/zx/releases/tag/8.0.0)

パッケージサイズの削減、`$.sync`の追加、`input`オプションの追加、AbortControllerのサポート、`kill`メソッドの追加などが行われています。
そのほかには、`$.verbose`のデフォルト値を`false`に変更、`ssh` APIの削除などの変更も含まれています

---

ESLint 9.0.0がリリースされました。

- [ESLint v9.0.0 released - ESLint - Pluggable JavaScript Linter](https://eslint.org/blog/2024/04/eslint-v9.0.0-released/)


Node.js 18.18未満のサポート終了、Flat Configをデフォルト化、ビルトインのformatterの一部をパッケージに移動、JSDocのルールを削除、`eslint:recommende`の更新などの変更が行われています。
また、開発者向けの変更としても`loadESLint()` APIの追加、RuleTesterのバリデーションの強化、ルールの書き方の変更などが行われています。

次のページにマイグレーションガイドが公開されています。

- [Migrate to v9.x - ESLint - Pluggable JavaScript Linter](https://eslint.org/docs/latest/use/migrate-to-9.0.0)

まだプラグイン側やtypescript-eslintなどがESLint v9をサポートしていないこともあるため、アップデートには注意が必要です。

- [ESLint v9 Support · Issue #8211 · typescript-eslint/typescript-eslint](https://github.com/typescript-eslint/typescript-eslint/issues/8211)

---

[New Flow Language Features for React | by Alex Taylor | Flow | Apr, 2024 | Medium](https://medium.com/flow-type/announcing-component-syntax-b6c5285660d0)という記事では、Flow v0.233.0で導入された`component`/`hook`/`renders`構文について紹介されています。
通常の関数とは異なる構文にすることでPropsのread-onlyのチェック、refのチェック、Hooksのチェックなどが行えるようになります。
これによって、間違いを減らすことや可読性を向上させることができるとしています。


{% if site.lang == "ja" %}

---

**PR**

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">Webフロントエンドを一緒にやる人を探しています(📩DM下さい) <br><br>会社的にやっていることは、以前Open Job Letterで書いていたものが近いと思います。(詳細はDMで)<a href="https://t.co/sCqdhjGhnx">https://t.co/sCqdhjGhnx</a><br>ヒト/モノ/カネ/クニが動いて、状況が激しく変化している領域なので、それを楽しめる人が向いてると思います。</p>&mdash; azu (@azu_re) <a href="https://twitter.com/azu_re/status/1775702750585925799?ref_src=twsrc%5Etfw">April 4, 2024</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

{% endif %}

----

{% include inline-support.html %}

----

<h1 class="site-genre">ヘッドライン</h1>

----

## Release 8.0.0 · google/zx
[github.com/google/zx/releases/tag/8.0.0](https://github.com/google/zx/releases/tag/8.0.0 "Release 8.0.0 · google/zx")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">ShellScript</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p>

zx 8.0.0リリース。
パッケージサイズの削減、`$.sync`の追加、`input`オプションの追加、AbortControllerのサポート、`kill`メソッドの追加。
`$.verbose`のデフォルト値を`false`に変更、`ssh` APIの削除など


----

## Announcing Rspack v0.6 - Rspack
[www.rspack.dev/blog/announcing-0.6](https://www.rspack.dev/blog/announcing-0.6 "Announcing Rspack v0.6 - Rspack")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">webpack</span> <span class="jser-tag">ReleaseNote</span></p>

Rspack 0.6リリース。
mini-css-extract-pluginの機能を組み込みサポート、デフォルトでTree Shakingを有効化。
CSSの順番が複数のchunkで矛盾している場合に警告を表示するようになるなど


----

## Node.js — Wednesday, April 10, 2024 Security Releases
[nodejs.org/en/blog/vulnerability/april-2024-security-releases-2](https://nodejs.org/en/blog/vulnerability/april-2024-security-releases-2 "Node.js — Wednesday, April 10, 2024 Security Releases")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">windows</span> <span class="jser-tag">security</span> <span class="jser-tag">ReleaseNote</span></p>

Node.jsのセキュリティアップデートとして v18.20.2 (LTS)/v20.12.2 (LTS)/v21.7.3 (Current)がそれぞれリリース。
Windowsにおける`child_process.spawn`のコマンドインジェクションの脆弱性の修正


----

## ESLint v9.0.0 released - ESLint - Pluggable JavaScript Linter
[eslint.org/blog/2024/04/eslint-v9.0.0-released/](https://eslint.org/blog/2024/04/eslint-v9.0.0-released/ "ESLint v9.0.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.0.0リリース。
Node.js 18.18未満のサポート終了、Flat Configをデフォルト化、ビルトインのformatterの一部をパッケージに移動、JSDocのルールを削除。
`eslint:recommende`の更新、`loadESLint()` APIの追加、RuleTesterのバリデーションの強化、ルールの書き方を変更など

- [Migrate to v9.x - ESLint - Pluggable JavaScript Linter](https://eslint.org/docs/latest/use/migrate-to-9.0.0 "Migrate to v9.x - ESLint - Pluggable JavaScript Linter")

----
<h1 class="site-genre">アーティクル</h1>

----

## New Flow Language Features for React | by Alex Taylor | Flow | Apr, 2024 | Medium
[medium.com/flow-type/announcing-component-syntax-b6c5285660d0](https://medium.com/flow-type/announcing-component-syntax-b6c5285660d0 "New Flow Language Features for React | by Alex Taylor | Flow | Apr, 2024 | Medium")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">flowtype</span> <span class="jser-tag">React</span> <span class="jser-tag">article</span></p>

Flow v0.233.0で導入された`component`/`hook`/`renders`構文について。
通常の関数とは異なる構文にすることでPropsのread-onlyのチェック、refのチェック、Hooksのチェックなどが行える


----

## App Router移行時に0.01%の確率でCSR遷移が404エラーになる - とろろこんぶろぐ
[oisham.hatenablog.com/entry/2024/04/04/105444](https://oisham.hatenablog.com/entry/2024/04/04/105444 "App Router移行時に0.01%の確率でCSR遷移が404エラーになる - とろろこんぶろぐ")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">article</span></p>

Next.jsではApp RouterとPages Routerが共存しているときは、パスがどちらのRouterかを判定するのに Bloom Filter を利用している。
この判定は確率的に判定ミスをするが、その際にはハードナビゲーションするため本来は問題が起きない。しかし、`basePath`オプションを利用時には問題があったという話。


----

## Breaking Down Next.js 14 | FocusReactive
[focusreactive.com/breaking-down-next-js-14/](https://focusreactive.com/breaking-down-next-js-14/ "Breaking Down Next.js 14 | FocusReactive")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">article</span></p>

Next.js 14のApp Router/Server Components/Data Fetching/Caching/Metadata/Dynamic Image Generationについて。


----

## History of JS interop in Dart. Support for Wasm just landed in the… | by Sigmund Cherem | Dart | Mar, 2024 | Medium
[medium.com/dartlang/history-of-js-interop-in-dart-98b06991158f](https://medium.com/dartlang/history-of-js-interop-in-dart-98b06991158f "History of JS interop in Dart. Support for Wasm just landed in the… | by Sigmund Cherem | Dart | Mar, 2024 | Medium")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">dart</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span></p>

DartのJavaScriptとの総合運用性の歴史について。
Dart 3.3で追加された`dart:js_interop`について


----

## Learn JavaScript  |  web.dev
[web.dev/learn/javascript](https://web.dev/learn/javascript "Learn JavaScript  |  web.dev")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">tutorial</span></p>

JavaScriptの基礎を学習するチュートリアル


----

## Migrating 500+ tests from Mocha to Node.js | Astro
[astro.build/blog/node-test-migration/](https://astro.build/blog/node-test-migration/ "Migrating 500+ tests from Mocha to Node.js | Astro")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">testing</span> <span class="jser-tag">article</span></p>

Mocha/Chaiから`node:test`/`node:assert`へテストを移行した話


----

## Optimizing WebKit &amp; Safari for Speedometer 3.0 | WebKit
[webkit.org/blog/15249/optimizing-webkit-safari-for-speedometer-3-0/](https://webkit.org/blog/15249/optimizing-webkit-safari-for-speedometer-3-0/ "Optimizing WebKit &amp; Safari for Speedometer 3.0 | WebKit")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">webkit</span> <span class="jser-tag">safari</span> <span class="jser-tag">performance</span> <span class="jser-tag">article</span></p>

WebKitでSpeedometer 3.0のベンチマークに合わせた最適化を色々と取り入れた話。


----
<h1 class="site-genre">ソフトウェア、ツール、ライブラリ関係</h1>

----

## Home | Ark UI
[ark-ui.com/](https://ark-ui.com/ "Home | Ark UI")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">UI</span> <span class="jser-tag">library</span></p>

React/Solid/Vueで、Panda CSS/Tailwind/Vanilla CSSに対応したHeadless UIコンポーネントライブラリ


----
<h1 class="site-genre">書籍関係</h1>

----

## The Framework Field Guide - Fundamentals | Unicorn Utterances
[unicorn-utterances.com/collections/framework-field-guide-fundamentals](https://unicorn-utterances.com/collections/framework-field-guide-fundamentals "The Framework Field Guide - Fundamentals | Unicorn Utterances")
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">React</span> <span class="jser-tag">Angular</span> <span class="jser-tag">Vue</span> <span class="jser-tag">book</span></p>

Angular/React/Vueを一度に学べることを目的にした書籍。


----

0 comments on commit 8fa4612

Please sign in to comment.