Discoverコードの現場から 〜泥臭い仕事と情熱〜ひと通りテストを書いてきたフロントエンドエンジニアの本音(テストフロントエンド編)
ひと通りテストを書いてきたフロントエンドエンジニアの本音(テストフロントエンド編)

ひと通りテストを書いてきたフロントエンドエンジニアの本音(テストフロントエンド編)

Update: 2023-09-06
Share

Description

若かりし日「僕の書いたコードはバグらないっす」と言ってテストを書かなかったゼロさんが、現在テストを書くようになるまでの体験談を生々しく語りました。昨今のフロントエンドのテスト手法を一通りさらえる内容になっています。




【話した人】


◆んだ(nda)


バックエンドエンジニア。元は国語の高校教師をしていたが、4年前にカラビナにフロントエンドとして入社。


◆ぜろ(zero)


フロントエンドエンジニア。元は広告の営業をしていたが、1年半のニートを堪能した後、4年前にカラビナに入社。




【話したこと】


00:05:20 ぜろのテスト遍歴


00:29:28 フロントなんて真剣に書くもんじゃない理論


00:40:40 次の案件のテスト戦略はこうする


01:02:20 Next.js v13.4 App Routerというビッグウェーブ


01:10:30 テストピラミッド、アイスクリーム型、トロフィー型


01:16:50 テストは精神安定剤




【話題に上がった技術】


◆Storybook(コンポーネントカタログ)


https://storybook.js.org/


◆Chromatic(Storybookのデプロイ先、ヴィジュアルレグレッションテスト)


https://www.chromatic.com/


◆Testing Library(コンポーネントテスト)


https://testing-library.com/


◆Cypress(E2Eテスト)


https://www.cypress.io/


◆Playwright(E2Eテスト、Cypressよりも最近はこっち推し)


https://playwright.dev/


◆Jest(テストランナー)


https://jestjs.io/ja/


◆Vitest(テストランナー、最近はJestよりこっち推し)


https://vitest.dev/


◆Next.js 13.4 App Router


https://nextjs.org/blog/next-13-4




【話題に上がった書籍】


◆フロントエンド開発のためのテスト入門


https://amzn.asia/d/6aFsU0D


◆単体テストの考え方/使い方


⁠https://amzn.asia/d/fNBw5gl

Comments 
In Channel
00:00
00:00
x

0.5x

0.8x

1.0x

1.25x

1.5x

2.0x

3.0x

Sleep Timer

Off

End of Episode

5 Minutes

10 Minutes

15 Minutes

30 Minutes

45 Minutes

60 Minutes

120 Minutes

ひと通りテストを書いてきたフロントエンドエンジニアの本音(テストフロントエンド編)

ひと通りテストを書いてきたフロントエンドエンジニアの本音(テストフロントエンド編)

カラビナテクノロジー