WebComponents
ken7253JSConf Korea 2022
React x Web Components : How It Is and How It Could Be by Dwane Hemmings | JSConf Korea 2022
概要欄DeepL訳
この講演では、現在のバージョンのReactでWeb Componentsがどのように実装されているかを調べ、フルサポートされている実験的なブランチと対比して、その利点について例を挙げながら説明します。
https://2022.jsconf.kr/en/speakers/dw...
Dwane Hemmings 長年の趣味のコーダーからプロに転向。ランダムプロジェクトのメーカー。
ken7253- WebComponentsの説明
- 面白いコンポーネントの紹介
- どのようなものを作ったのか
- WebComponentsは実際に使われてるよ
- ブラウザの互換性
ken7253作成したコンポーネントの紹介の部分で
- プロパティ
- メソッド
- カスタムイベント
が紹介されている。
機能を持ったコンポーネントの場合カスタムイベントを利用するとより外部からの使い勝手が良くなりそう。
ken7253WebComponentsを使っているサービスの話
GitHub - time-element
動画上ではtime-elementsとして紹介されていたが、確認したらrelative-time-element担っていた。
（恐らくNPMの方はtime-elementになっていたのでリポジトリ名が変わっただけっぽい？
PRとか変更をプッシュしたタイミングは** years agoとかlast monthとか表示されるので
それを表示するためのコンポーネントっぽい。
ken7253WebComponentsのデータ処理・イベント処理？について
WebComponentsはデータを属性値として取得する（≒文字列での取得）からオブジェクトを受け取れないよねって話[Object object]になって辛い。
後なんか要素から発生するイベントをリッスンできないのが辛いみたいな感じ？
useRefを例に出していた。
※ここらへんかなり曖昧
ken7253コンポーネントのスタイリングについて
::part()について触れられていた。
::part()は事前にWebComponents側で決められた要素に対してスタイルを当てられる機能（？）
あとはCSS変数を使用してスタイルをカスタムする方法についても触れられていた。
ken7253eslint-plugin-functional
JSで関数型っぽいことをやるためのルールセットっぽい。
機能解説記事とか書いてみる？