Upgrade to Pro — share decks privately, control downloads, hide ads and more …

【26新卒研修資料】TDD実装演習

 【26新卒研修資料】TDD実装演習

More Decks by ディップ株式会社

Other Decks in Programming

Transcript

  1. Agenda 01 オープニング 初めまして! 02 TDDについて Test-Driven Development (テスト駆動開発) 03

    デモ Fizz Buzz 04 テストについて 良いテストとは 05 演習課題 給与情報表示関数の実装
  2. 権 奈悟 こん なお プロダクト開発統括部/プロダクトソリューショ ン部/メディアアプリ開発課 バイトル→NEXT→はたらこ→バイトル iOSエンジニア 吉本 胡葉

    よしもと ことは 最近かぼちゃにハマってます ⾟いのが好き プロダクト開発統括部/プロダクトソリューショ ン部/メディアアプリ開発課 25卒 ⼊社からずっとバイトル Android エンジニア 好きな⾷べ物はバナナとブルーベ リー
  3. dip_tech Copyright © DIP Corporation, All rights reserved. 5 講義の目的

    自分が書いたコードが正しく動いているか、常に確信を持てる状態を作る 「テストが書きにくいコードは、設計が悪い」という気づきを与え、疎結合で責務が明確なコードを 書く習慣をつける 「動けばいい」ではなく、将来の自分やチームが安心してリファクタリングできる状態を維持する責 任感を養う
  4. dip_tech Copyright © DIP Corporation, All rights reserved. 6 講義のゴール

    1 Red-Green-Refactorのサイクルを体感する 2 TDDとAI-DLCの手法での開発を体験する 3 TDDとは、良いテストとはについて説明できる
  5. dip_tech Copyright © DIP Corporation, All rights reserved. 7 講義の流れ

    座学(20min)+実践(45min) 質問タイムもとりますが、わからなければその場で質問お願いします! 聞いて学ぶスタイル >>> みんなで議論を目指したいです ‼
  6. リファクタ TDDとは 従来の開発 テスト駆動開発 (TDD) → Test-Driven Development (テスト駆動開発 )

    テスト駆動開発とは、テストファーストな開発手法の 1つ。プログラムを書き始める前に、まずそのプロ グラムが正しく動くか確認するための「テストコード」を先に書く。 実装 実装 → テスト テスト → →
  7. TDDの3つのサイクル Red (失敗) まだ存在しないコードのテストを書く / 実行して、正しく失敗することを確認する(仕様の定義) Green (成功) テストを通すためだけの「最低限」のコードを書く Refactor

    (改善) テストが通った状態を維持したまま、 コードを綺麗にする / 重複の排除、命名の変更、設計の整理を行う Red-Green-Refactor https://service.shiftinc.jp/column/4654/
  8. TDDと従来の開発の比較 従来の開発(テスト後回し) 1. 設計を考える 2. コードを書く(数百行〜数千行) 3. 動かしてみる 4. バグ発見

    😱 5. どこが悪いか探す(数時間〜数日) 6. やっとテストを書く TDD(テスト駆動開発) 1. 小さなテストを書く(数分) 2. 最低限のコードを書く(数分) 3. すぐテスト実行 4. 通った!次のテストへ 5. 少しずつ機能が完成 TDDが適しているシステムの特徴 : 複雑なビジネスロジック・長期的な保守が必要な時
  9. テストしやすい /しにくい 単一責任の原則( SRP)に基づく 一つのモジュールは一つの責任のみを持つ 依存関係の分離 依存オブジェクトを外部から注入する モジュール化・分離 各部分が独立しており、個別にテストできる 純粋な関数

    外部状態に依存せず、同じ入力に対して常に同じ出力を返す 小さく単機能な関数にする テストが用意になる 依存関係が内部生成 副作用が多い 複雑な条件分岐、メソッドが長い テストケースが多くなる
  10. dip_tech | Copyright © DIP Corporation, All rights reserved. 実装に⼊る前のチェックリスト

    • リポジトリをクローンした ⭕ • day4/02.テスト駆動の実装演習(75min)に移動した ⭕ • npm install` を実⾏した ⭕ • npx vitest runでテストが動くことを確認した ⭕
  11. dip_tech | Copyright © DIP Corporation, All rights reserved. やること

    • 実際にAIDLCにおけるTDDを簡単な関数でやってもらいます • プロンプト例があるので⾃分の使いやすい形で使ってみてください!!!
  12. dip_tech | Copyright © DIP Corporation, All rights reserved. 演習課題

    Lv.1 お題:給与表⽰フォーマッター 求⼈の給与情報を、ユーザーに⾒せるための表⽰⽤テキストに変換する関数 を作ってください。 ざっくり仕様 • 下限⾦額と上限⾦額を受け取って、表⽰⽤の⽂字列を返す • ⾦額にはカンマをつけて⾒やすくする • 下限と上限が同じなら1つだけ表⽰する • 下限と上限が違うなら範囲で表⽰する • 五桁以上はバリデーションする • 下限と上限が逆の場合:逆転 • ⼊⼒された値がnull or undifind:数値以外はエラー • 負の数がきた場合はエラー • 最低賃⾦1000円
  13. dip_tech | Copyright © DIP Corporation, All rights reserved. 演習課題

    Lv.1 お題:給与表⽰フォーマッター 追加仕様がきました‼ 上限⾦額が未⼊⼒の場合にも対応してほしい。 「下限だけわかってるけど上限は未定」というケース。
  14. dip_tech | Copyright © DIP Corporation, All rights reserved. 演習課題

    Lv.2 お題:応募締め切りカウントダウン 求⼈の応募締め切り情報を、ユーザーに⾒せるための表⽰ ⽤テキストに変換する関数を作ってください。 ざっくり仕様 • 本⽇⽇付と締め切り⽇付を受け取る • 締め切りまで1⽇以上あるなら「あと◯⽇で終了」と 返す • 締め切り当⽇なら「本⽇締切!」と返す • 締め切りを過ぎていたら「掲載終了しました」と返す • Date型で返却される •
  15. dip_tech | Copyright © DIP Corporation, All rights reserved. 演習課題

    Lv.2 お題:応募締め切りカウントダウン 追加仕様がきました‼ • 締め切りまで3⽇以内の場合のみ、⽂字列の末尾に 「🔥」マークをつける( 例:「あと2⽇🔥」 • 当⽇(「本⽇締切!」)には🔥はつけない
  16. dip_tech | Copyright © DIP Corporation, All rights reserved. 演習課題

    Lv.3 お題:NGワード‧マスキング 不適切な投稿を⾃動で防ぐ、NGワードの伏せ字(マスキ ング)関数を作ってください。 ざっくり仕様 • 特定のNGワード(「絶対稼げる」「ブラック」)を ** に置換する • 電話番号を [電話番号は⾮表⽰] に置換する
  17. dip_tech | Copyright © DIP Corporation, All rights reserved. 演習課題

    Lv.3 お題:NGワード‧マスキング 追加仕様がきました‼ • ハイフンなしの電話番号(例:09012345678)も検知し て [電話番号は⾮表⽰] に置換する • ただし、郵便番号(例:100-0001)や⼝座番号のような 短い数字列は誤検知しないこと
  18. dip_tech | Copyright © DIP Corporation, All rights reserved. まとめ!

    今⽇の演習はシンプルなロジックでしたが、実務ではもっと複雑な仕様や条件分 岐がたくさん出てきます。 そういうときこそ 「先にテストを書いて、仕様を固めてから実装する」 TDDの進 め⽅が効いてきます。 AIに実装を任せる場⾯でも、テストがあれば「本当に正しいか」を⾃分で確認で きる。 ぜひ実務でも活⽤してみてください。