VibeCoding時代のエンジニアリング

Slide 1

Slide 1 text

1 Vibe Coding時代のエンジニアリングどすこい Hack-1グランプリ 6限⽬ 2025.05.11

Slide 2

Slide 2 text

2 こんにちは！ご参加ありがとうございます！

Slide 3

Slide 3 text

3 GMOペパボ Webエンジニアどすこい Daisuke Takeda 2024新卒⼊社のどすこいです！普段はWeb開発したり、社内のAI活⽤を推進したり、アウトプットしたり。好きな漫画: 葬送のフリーレン X: @doskoi64 #Hack1グランプリでわいわいしてください！

Slide 4

Slide 4 text

4 私たちは「⼈類のアウトプットを増やす」ことをミッションとし、インターネットやテクノロジーの⼒で情報発信のハードルを下げる⽀援をしています。

Slide 5

Slide 5 text

5 今⽇のテーマは...

Slide 6

Slide 6 text

Slide 7

Slide 7 text

● Vibe Codingができるようになって起きた変化 ● 変化によってプロダクト開発はどうなっていくのか ● そのなかで僕らはどうすればいいんだろうか今⽇話す事 7

Slide 8

Slide 8 text

• Vibe Codingとは • Vive Codingによる根本的な変化 • Vive Codingとプロダクト開発 • Vive Codingとエンジニアリング Outlines 8

Slide 9

Slide 9 text

• Vibe Codingとは • Vive Codingによる根本的な変化 • Vive Codingとプロダクト開発 • Vive Codingとエンジニアリング Outlines 9

Slide 10

Slide 10 text

10 完全に雰囲気に⾝を任せて、コードの詳細に気を払わず、⾃然⾔語だけで指⽰をしてコーディングする Andrej Karpathy (X:@karpathy) 2025-02 Vibe Codingとは Vibe Codingとは

Slide 11

Slide 11 text

11 Vibe Codingとは Vibe Codingとは

Slide 12

Slide 12 text

12 Vibe Codingとは Vibe Codingとは

Slide 13

Slide 13 text

13 Vibe Codingとは Vibe Codingとは

Slide 14

Slide 14 text

14 これが Vibe Codingとは

Slide 15

Slide 15 text

Slide 16

Slide 16 text

16 (余談) 実はショップがあります！ https://suzuri.jp/vibecoding Vibe Codingとは

Slide 17

Slide 17 text

• Vibe Codingとは • Vive Codingによる根本的な変化 • Vive Codingとプロダクト開発 • Vive Codingとエンジニアリング Outlines 17

Slide 18

Slide 18 text

Vibe Codingによる根本的な変化 18

Slide 19

Slide 19 text

Vibe Codingによる根本的な変化 19 ~ 2021

Slide 20

Slide 20 text

Vibe Codingによる根本的な変化 20 2022 ~ 2023

Slide 21

Slide 21 text

Vibe Codingによる根本的な変化 21 2024 ~ 今

Slide 22

Slide 22 text

Vibe Codingによる根本的な変化 22 2024 ~ 今

Slide 23

Slide 23 text

23 ⼈間とAIのドライバー交代

Slide 24

Slide 24 text

24 https://staﬀ.persol-xtech.co.jp/hatalabo/mono_engineer/568.html Vibe Codingによる根本的な変化

Slide 25

Slide 25 text

25 ⼈間とAIのドライバー交代 Vibe Codingによる根本的な変化

Slide 26

Slide 26 text

26 ⼈間とAIのドライバー交代 Vibe Codingによる根本的な変化

Slide 27

Slide 27 text

27 https://speakerdeck.com/watany/the-end-of-the-special-time-granted-to-engineers?slide=36 Vibe Codingによる根本的な変化

Slide 28

Slide 28 text

28 ⼈間が数⼗、数百⾏コードを1⽇で書くところ... ⼈間とAIのドライバー交代 Vibe Codingによる根本的な変化

Slide 29

Slide 29 text

29 ⼈間が数⼗、数百⾏コードを1⽇で書くところ... AIを使えば1万⾏書くことができる圧倒的な量を誰でも書くことができる⼈間とAIのドライバー交代 Vibe Codingによる根本的な変化

Slide 30

Slide 30 text

30 Vibe Codingによる根本的な変化圧倒的な量をAIが⽣成している図

Slide 31

Slide 31 text

• Vibe Codingとは • Vive Codingによる根本的な変化 • Vive Codingとプロダクト開発 • Vive Codingとエンジニアリング Outlines 31

Slide 32

Slide 32 text

32 Vibe Codingとプロダクト開発

Slide 33

Slide 33 text

33 圧倒的な量を誰でも書くことができる Vibe Codingとプロダクト開発

Slide 34

Slide 34 text

34 じゃあ、 AIに爆発的にコードを書かせて⼤量リリースさせればそれでええやん Vibe Codingとプロダクト開発

Slide 35

Slide 35 text

35 ...ほんと？ Vibe Codingとプロダクト開発

Slide 36

Slide 36 text

36 破綻します！ Vibe Codingとプロダクト開発

Slide 37

Slide 37 text

37 破綻します！これを検証してみましょう！ Vibe Codingとプロダクト開発

Slide 38

Slide 38 text

Vibe Codingとプロダクト開発 38 1万⾏のコードがかけました！

Slide 39

Slide 39 text

Vibe Codingとプロダクト開発 39 1万⾏のコードがかけました！お、あざす！

Slide 40

Slide 40 text

Vibe Codingとプロダクト開発 40 レビューお願いします ...ん？

Slide 41

Slide 41 text

41 ソフトウェア開発のレビューとは、他⼈のコードや設計を⾒て、品質の維持や向上のための確認や提案をすること。⽬的は、品質向上‧バグ防⽌‧知識共有です。やることは、コードや設計に⽬を通してコメントや修正案の提案をすることです。レビューとは Vibe Codingとプロダクト開発

Slide 42

Slide 42 text

Vibe Codingとプロダクト開発 42 レビューお願いします

Slide 43

Slide 43 text

43 ソフトウェア開発のレビューとは、他⼈のコードや設計を⾒て、品質の維持や向上のための確認や提案をすること。⽬的は、品質向上‧バグ防⽌‧知識共有です。やることは、コードや設計に⽬を通してコメントや修正案の提案をすることです。レビューとは Vibe Codingとプロダクト開発これを1万⾏のコードで...

Slide 44

Slide 44 text

44 1万⾏のコードレビュー Vibe Codingとプロダクト開発

Slide 45

Slide 45 text

45 1万⾏のコードレビュー Vibe Codingとプロダクト開発

Slide 46

Slide 46 text

46 1万⾏のコードをお祈りリリース Vibe Codingとプロダクト開発よく⾒てないけど、ええやろバグ起きないでくれ〜リリースします

Slide 47

Slide 47 text

47 Vibe Codingとプロダクト開発障害が発⽣しないって⾔えますか？

Slide 48

Slide 48 text

48 Vibe Codingとプロダクト開発後戻りできない変更はないですか？

Slide 49

Slide 49 text

49 Vibe Codingとプロダクト開発数字がズレてたらどう調査しますか？

Slide 50

Slide 50 text

50 Vibe Codingとプロダクト開発ユーザーが⾒たらどう思いますか？

Slide 51

Slide 51 text

51 1万⾏のコードをお祈りリリース Vibe Codingとプロダクト開発

Slide 52

Slide 52 text

52 コードを検証できないコードを更新できないコードを保証できない祈ることしかできない 1万⾏コードを簡単にリリースできない Vibe Codingとプロダクト開発

Slide 53

Slide 53 text

• Vibe Codingとは • Vive Codingによる根本的な変化 • Vive Codingとプロダクト開発 • Vive Codingとエンジニアリング Outlines 53

Slide 54

Slide 54 text

54 Vibe Codingとエンジニアリング

Slide 55

Slide 55 text

55 だめじゃん...？ Vibe Codingとエンジニアリング

Slide 56

Slide 56 text

56 けど、なんとかしたい！ Vibe Codingとエンジニアリング

Slide 57

Slide 57 text

57 AIによる桁違いのコードの物量をなんとかしたい！そこでどうやって⼤量リリースするのか Vibe Codingとエンジニアリング

Slide 58

Slide 58 text

58 AIによる桁違いのコードの物量をなんとかしたい！そこでエンジニアリングどうやって⼤量リリースするのか Vibe Codingとエンジニアリング

Slide 59

Slide 59 text

59 いくつかの例を紹介します！ Vibe Codingとエンジニアリング

Slide 60

Slide 60 text

60 どうやって⼤量に検証するのか Vibe Codingとエンジニアリング⾃動テストを徹底する⾃動テストとは、プログラムが正しく動くかを⾃動で確認する仕組み。それまで動いていたプログラムの動作が正常であることが⾃動的に確認できる。

Slide 61

Slide 61 text

61 どうやって⼤量に更新するのか Vibe Codingとエンジニアリング適したアーキテクチャを選択するアーキテクチャとは、ソフトウェア全体の設計の⾻組みのこと。適切なアーキテクチャを選択しておくことで、⼩さな変更で全体が壊れることを防いだり、拡張‧修正がしやすくなったりする。

Slide 62

Slide 62 text

62 どうやって⼤量に保証するのか Vibe Codingとエンジニアリング品質維持のための静的解析静的解析とは、プログラムを実⾏せずにコードを分析すること。その時点でわかるバグやセキュリティリスク、コード品質の問題を⾒つける。

Slide 63

Slide 63 text

63 どれもAIに関係なく既に実践されている技術です！特別な技術が必要なのではなく、まずは、これまで培ってきた技術が、より⼀層真価を発揮することになります。また、企画やプロモーション、カスタマーサポートなど、組織全体で対応していく必要があります。 Vibe Coding時代のエンジニアリング Vibe Codingとエンジニアリング

Slide 64

Slide 64 text

64 これがVibe Coding時代のエンジニアリングで重要なマインドセットです。この時代をチャンスと捉えて、職域や専⾨領域を超えて、アウトプットしましょう！ AIによる圧倒的な量をどうやって価値へ繋げるのか

Slide 65

Slide 65 text

65 くわしくはこちらで！ https://tech.pepabo.com/2025/04/04/declaration-vibe-coding-training/

Slide 66

Slide 66 text

66 https://tech.pepabo.com/2025/05/07/competitive-vibe-coding-competitive-vibe-coding/

Slide 67

Slide 67 text

67 Let’s Vibe