フロントエンドチーム LT会【４月号】

こんにちは！ラクス フロントエンドチームの松浦です！
今年も春がやってきましたね。
桜満開！と思っていたらいつの間にか緑の葉っぱになってました…。
少し悲しかったです。

フロントエンド開発課で定期的に開催されるチームLT会の4月分をまとめたものを共有させていただきます。
今月はイベントが色々とあり共有会が1度しか開催されなかったのでちょっと短めです…。すみません。

ラクス フロントエンドチームでは、チームのコミュニケーション活性化を目的とした、チームLT会を開催しています。（会の目的や、効果についてはこちらの記事にまとめています。ぜひ、ご覧ください！）
チームLT会で発信した情報は、社内だけでなく世界にも余すことなく発信していきたいと思い、noteにて定期投稿しています。

ココがすごいぞ！ Playwright Component Test!

昨年から急激に注目されている「Playwright」のコンポーネントテストの機能について、どのような点がすごいのかをまとめてくれています。

■ コメント / ガヤ
・最近はCypressからPlaywrightへの移行が増えてきているんですかね？
    > 移行が増えてきているかは分かりませんが、npmでのダウンロード数は
　　未だCypressの方が上って感じです。
　　ですが、去年あたりからダウンロード数は急速に伸び始めています。
　　https://npmtrends.com/cypress-vs-playwright

個人的な感想
E2Eテスティングライブラリがコンポーネント単位でテストを可能にすることにより、これから多くの場面でPlaywright Component Testが活躍すると確信しました。
また、今までは難しかったi18nextの見た目部分のテストやレスポンシブデザインに対するテストのようにJestでは難しけど、Page単位によるE2Eテストでは規模が大きいみたいな部分のテストには最適だと感じました。

---

非破壊的な配列メソッド

プログラミングをやってた人なら誰でも覚えることになる、「破壊的」と「非破壊的」なメソッド。
その中でもES2023で追加された新しいメソッドの一つ「with」について超簡単に紹介してくれています。

個人的な感想
破壊的・非破壊的な配列メソッドを短い時間で振り返ることができる素晴らしいスライドでした。
特にwithは簡単に特定位置の値を書き換えることができる関数だと思いました。今までは、spliceに3つの引数を指定して破壊的に書き換えていたのですが、withでは2つの引数でかつ、非破壊的に書き換えるので安全です。
配列操作の際には積極的に使っていきたい関数だなと思いました。

---

TypeScript5.4の新機能について

TypeScriptのv5.4で追加された多くの機能の中から「クロージャ内での型情報の保持」「NoInfer」について紹介してくれています。

個人的な感想
v5.4でも特に注目されていると思っているNoInferについてまとめてくれていてとても嬉しいです。
NoInferのおかげで型推論に制限をかけ、意図しない型が推論されないようになりました。
より、型の安全性は上がり、開発の効率は上がっていくと思われます。

終わりに

今月は1度しか共有会が開催されなかったということもあり、少ししか載せられませんでした…が、全てスライドでわかりやすくまとめられており、内容は濃かったと思います！  
5月号は5月の末あたりに投稿する予定です。
お楽しみに！

最後まで読んでいただいてありがとうございました！！
よろしければ、「スキ」お願いします！

採用情報

https://career-recruit.rakus.co.jp/engineer_jobs/frontend_tokyo/

https://career-recruit.rakus.co.jp/career_engineer/

イベント情報

https://rakus.connpass.com/