はじめに
私は社会人生活のほとんどを経理や情シスなどで過ごしてきた40代のサラリーマンです。
ですので生粋のエンジニアに技術は到底及びません。
それでもチーム開発の一員として細々とスキルアップを続けてきたことと、AIエージェントの質向上が相まって担当できる範囲が増えてきました。
もちろん多くはAIエージェントのおかげですが、そのせいで自身のスキルが未熟なことに蓋をしたまま、前のめりにどんどん開発範囲を広げていました。
バイブコーディングは諸刃の剣
自分の開発スタイルを見直すきっかけになったのは、レビュアーからこう言われたことでした。
「AIに依存しすぎですね」
その当時の実装スタイルとしては、
- 実装計画が曖昧なまま実装したいことをプロンプトとして入力し、いきなりAgentモードで実装
- 実装されたものを壁打ちしながら修正を進める
という感じでやっており、まさにその通りでしたので返す言葉もありませんでした。
簡単なタスクならまだしも複雑なタスクになると実装が迷走することが多々あり、結果としてAIへの依存度の高い、プロダクトとしては不十分なバイブコーディングを露呈することになってしまったのです。
個人開発で動けばいいというレベルならそのままでも良かったかもしれません。
でもプロダクトではそうはいきませんので、今後の対策案を考える必要があります。
バイブコーディングを適切に管理するために必要なこと
とは言ってもいきなり自身のスキルが爆上がりする魔法なんてありません。
でもAIエージェントの出たとこ勝負の実装を許すわけにはいきません。
今の自分で最大限バイブコーディングを適切に管理する方法はなんだろう・・・
あれこれ考えていた時、エンジニアと畑違いの業務でよく言われてきた「PDCAサイクル」というフレーズがふと頭をよぎりました。
よくよく考えたら開発もPDCAサイクルの積み重ねではないかと思い、開発の一連の流れをPDCAサイクルに落とし込むことで開発スタイルを定着させたいと考えました。
私が考えるPDCAサイクル
開発においてはPDCAを「実装計画の立案」「コーディング」「レビュー&PR」「ルールの改善」に分けました。
それでは各項目ごとに内容を説明します。
Plan(実装計画の立案)
まずPlanモードで実装計画を立てます。
mdファイルには「背景・目的」などの概要部分と「実装仕様」などの詳細内容を記載し、概要部分をベースにGitHub Issueを作成します。
この時点で実装内容を俯瞰し、どのような方針で実装されるのかをよく確認します。
内容の理解が追いつかない場合、あらかじめ仲間に相談しておくと手戻りが少なく済んでいいと思います。
以降Todoアプリの機能追加を例にします。
# Todoフィルター機能 実装計画
**作成日**: 2025年12月19日
**目的**: Todoアプリに完了/未完了のフィルター機能を追加する
---
## 背景
現在のTodoアプリは全てのタスクを一覧表示するのみで、完了済みタスクと未完了タスクを分けて表示できない。ユーザビリティ向上のため、ステータスによるフィルター機能を実装する。
---
## タスク一覧
- [ ] フィルター用の定数定義
- [ ] フィルター状態管理用のstate追加
- [ ] フィルターUIコンポーネントの実装
- [ ] フィルターロジックの実装
- [ ] 既存のTodoリスト表示にフィルターを適用
---
## 変更対象ファイル
| ファイル | 変更内容 |
|---------|---------|
| `constants.ts` | フィルター種別の定数追加 |
| `TodoList.tsx` | フィルター機能の実装 |
| `types/todo.ts` | フィルター関連の型定義追加 |
---
## 実装仕様
### 1. 定数定義(constants.ts)
```typescript
export const TODO_FILTERS = {
ALL: 'all',
ACTIVE: 'active',
COMPLETED: 'completed'
} as const;
※その他の実装内容は省略
Do(コーディング)
ここではPlanで作成した実装内容に即してAgentモードでコーディングをしてもらいます。
時間やコストは目を瞑り、最も良いモデルを使いましょう!
Check(レビュー&PR)
Agentモードのコーディングが終わったら、次はレビューです。
AIエージェントと自身のセルフレビューが終わったら、レビュアーにPRを出しましょう!
・・・しかし、以下のような指摘を受けてしまいました。
定数はconstants.tsに実装することになっていましたが、実装ファイル内で定義してしまったようです。
指摘内容を確認し、即座に修正します。
# PR: Todoフィルター機能の実装
## 指摘事項
### 🔵 Minor: 定数管理の改善が必要
**ファイル**: `TodoList.tsx`
**問題点**:
1. フィルター種別の定数(`FILTER_ALL`, `FILTER_ACTIVE`, `FILTER_COMPLETED`)がコンポーネント内に直接定義されている
2. フィルターラベル("全て"、"未完了"、"完了済み")がハードコードされている
3. 文字列リテラルによる比較が複数箇所に散在している
**影響**:
- 定数の一元管理ができず、変更時に複数箇所を修正する必要がある
- タイポのリスクが高い
- 他のコンポーネントで同じフィルターを使う際に重複コードが発生する
**改善案**:
・・・以下実際の修正コード案は省略
Action(ルールの改善)
今回の指摘は定数の定義を実装ファイル内で行っており、コードの保守性が悪いというものでした。
動作には影響しないマイナーな指摘ですが、今後も同じミスを繰り返し、修正されないままうっかりPRを出してしまうかもしれません。
以後AIエージェントにコーディングしてもらう際に再発しないよう、定義ファイルに書いておきます。
Claude CodeならCLAUDE.mdに記載しておきます。
# 開発ガイドライン
## 定数管理ルール
### 基本方針
**全てのマジックナンバー、マジックストリング、設定値は`constants.ts`で管理する**
最後に
バイブコーディングを駆使することで自身のスキルが足りていなくてもある程度のスキルをこなすことはできるかもしれません。
しかし、すでに多くの方がすでに多くの方が指摘されているとおり、責任を持ってチェックするのはAIエージェントではなく自分自身です。
今後もその自覚を持ち、AIエージェントの特性を最大限に活かすことで自身のスキルアップを最速で推し進め、プロダクトに貢献していきたいと思います。
