bolt.new in 実務（AI駆動開発勉強会）

Transcript

1. bolt.new in 実務 2025 . 01 . 14 AI駆動開発勉強会 1 PRESENTER: @ko-hi-san BY CREATIONLINE.Inc
2. bolt.new in 実務 自己　　　 　　紹介　 CREATIONLINE.Inc 2 クリエーションライン株式会社 フルスタックエンジニア 好きなもの #うちの犬1匹 #うちの猫2匹 #妻1人 #田舎(香川) #コーヒー #beer #料理 #飲酒 #おしゃべり #アニメ鑑賞
3. bolt.new in 実務 目 次 CREATIONLINE.Inc 3 1. Outline（結論） 2. Intro-background（背景） 3. Adoption Hurdles（導入の壁） 4. dev flow(開発の流れ) 5. outcome（成果） 6. know-how & Challenges （ノウハウと課題） 7. Next-Step（展望）
4. “ bolt.new in 実務 CREATIONLINE.Inc まずは取り入れてみよう。 チームにあった導入方法を考え、 小さく使っていけば、 おのずと先が見えてくる。 4 outline 今日お伝えしたいこと その1
5. “ bolt.new in 実務 CREATIONLINE.Inc PoC開発にbolt.newを 採用したことで開発スピードが 向上した！！！ 5 outline 今日お伝えしたいこと その2
6. bolt.new in 実務 Intro- background 背景 CREATIONLINE.Inc 6
7. bolt.new in 実務 CREATIONLINE.Inc 7 • 全社のソフトウェア開発プロジェクトを採算管理 するシステム • 2024/10~2025/12 の短期間（納期必達） • 要求定義はある程度完了しているが、 要件定義はこれから • 要件を落とさないと間に合わない ボリューム感 大企業の 社内システム開発 プロジェクト
8. bolt.new in 実務 CREATIONLINE.Inc 8 顧客 • システム企画部　3名 開発チーム • システム開発部 ◦ プロダクトオーナー　1名 ◦ エンジニア　4名 （うち3名が弊社） チーム体制
9. bolt.new in 実務 CREATIONLINE.Inc 9 • 開発期間が短く、人員を増やすことの効果は乏し い • 開発期間が短く、後から要件がひっくり返ると取り 返せない。 • エンドユーザーの期待する機能を探りつつ、不要 な要件を落としていく 当時考えたこと
10. bolt.new in 実務 CREATIONLINE.Inc 10 1. アジャイル こまめに顧客からのFBが欲しい 手戻りを最小限に抑える 2. PoC まずは顧客の要求を形にし、実際に使えそうかイ メージを掴んでもらう 3. AIを活用した開発生産性の向上 PoCを爆速で作るために、bolt.newを採用する Cursor および Copilotを使用する 決めたこと
11. bolt.new in 実務 CREATIONLINE.Inc 11 <2024/11> • リリース直後から社内チームが検証を開始 • 11月後半には社内向けの勉強会開催 bolt.newを事前に触っていたことでメンバー間の知識 のベースラインが揃っており、すぐに使うことができる。 ツール特性として、コード全体を見ながら大きくコードを 生成してくれる。 なぜbolt.new?
12. bolt.new in 実務 Adoption Hurdles 導入の壁 CREATIONLINE.Inc 12
13. bolt.new in 実務 CREATIONLINE.Inc 13 セキュリティ面の考慮 データの取り扱いについて調査を実施 • teamプランを採用（メールサポートの有無） • 運営に学習に使用されないことを確認 • 入力禁止用語等のガイドラインを作成し、準拠し て利用する ガバナンス
14. bolt.new in 実務 CREATIONLINE.Inc 14 不確実性回避 人間誰しも初めてのことは不安に感じるもの • AIが生成するコード品質への心配 心理的不安 現実を整理する • スピード面はAIに分がある • 品質は私たちでカバーする
15. bolt.new in 実務 Dev Flow CREATIONLINE.Inc 15 開発の流れ
16. bolt.new in 実務 CREATIONLINE.Inc 16 動きはない状態で まずは必要な機能 について認識ズレ がないことを顧客と 合意する 開発者も全員同席 する 合意のとれた機能 からboltでコードを 生成する boltで実装の難し い箇所や 軽微な修正、 リファクタリング等 を実施する 完成した機能を顧 客に見てもらい、修 正点をバックログ に積んでいく ワイヤー作成 顧客との合意 bolt.new コーディング 顧客レビュー 1機能に対して、boltでの実装と手実装を明確に分離する。 boltは開発スピードを高めるためのサポートツールとして、boltで作り切ることに固 執しないよう意識した。
17. bolt.new in 実務 outcome CREATIONLINE.Inc 17 成 果
18. bolt.new in 実務 “一般的なWEBのUI” “PoCとしてプロダクトレベルの品質 を求めない” という前提であれば、 許容できる品質のものは手実装に比 べて倍以上のスピードがでることも。 ものによっては１ページが 30分ほど で完成する。 開発スピードの向上 50%↑ (感覚です。すみません。) 18 CREATIONLINE.Inc
19. 顧客からの感謝 CREATIONLINE.Inc 実際に手を動かし始めてから約三週間ほどでメインの ユーザーストーリーを（フロントだけだが）顧客に見せる ことができた。 「大変な中で作り上げてくれてありがとう。」 「これからもよろしく。」 嬉しいコメントをいただけました。 まだまだ開発は続きますし、改善点もまだまだありま す。 引き続き頑張ろう。
20. bolt.new in 実務 Know-how & Challenges 20 ノウハウと課題 CREATIONLINE.Inc
21. bolt.new in 実務 CREATIONLINE.Inc 21 ” jspreadsheet ”という有料ライブラリを使用 ドキュメントを渡しても無理やりDOM操作で実現しようと してしまう… 結論、boltは使用せず手動でコーディングすることにし た AIの学習データの少なさが起因している可能性？ 有料ライブラリ意外にも苦手な領域がきっとあるので、 導入フェーズでの認識合わせを推奨 ① 有料ライブラリ に弱い Know-how
22. bolt.new in 実務 CREATIONLINE.Inc 22 開発スピードが高速な分、コミュニケーション頻度を 高める必要がある。 • 誰がどのバックログに着手するか • 共通で使えるメソッドはないか など、これまで以上に密なコミュニケーションが求めら れる。 レビューは割り込みとして優先的に対応するなど、開 発体制もツールに合わせてブラッシュアップが必要。 ② メンバー間の コミュニケーション の重要性 Know-how
23. bolt.new in 実務 CREATIONLINE.Inc 23 「1箇所が完成しても、気づいたら別の機能がなくなって いる」という事象も。 →　Next.jsのAppRouterを採用し、フォルダ単位で機 能を分けて生成することでリスクを軽減。 これについては現在StackBlitzチームが Github連携 を開発中とのこと。 ③ デグレ対応 Know-how Challenges
24. PRESENTATION NAME 24 Next-Step 展 望 CREATIONLINE.Inc
25. bolt.new in 実務 AI 駆動開発 テスト 駆動開発 25 CREATIONLINE.Inc
26. bolt.new in 実務 CREATIONLINE.Inc 26 テストリスト（todoリスト）を作り、テストコード含めて実装してもらう コード生成された時点で、以下ができていることに。 ①仕様を満たしている（仕様が明確になっている） ②テストコードがあるのでリファクタリングできる PoCから本番開発への移行がスムーズに AI駆動開発 × テスト駆動開発 = AI駆動テスト駆動開発 AIDTDD
27. “ bolt.new in 実務 CREATIONLINE.Inc まずは取り入れてみよう。 チームにあった導入方法を考え、 小さく使っていけば、 おのずと先が見えてくる。 27 outline 今日お伝えしたいこと その1
28. “ bolt.new in 実務 CREATIONLINE.Inc PoC開発にbolt.newを 採用したことで開発スピードが 向上した！！！ 28 outline 今日お伝えしたいこと その2
29. THANK YOU 弊社に興味もってくれたかたは ぜひ一度カジュアル面談を！ 29 ご清聴ありがとうございました！