はじめに
AIツールの普及により、エンジニアの働き方は大きく変わりました。特に新人エンジニアにとって、AIは学習を加速し、生産性を向上させる強力な味方となります。
実際にこの記事も構成などの大枠の作成と文章の添削などをはAI(Claude)に作成してもらいました。
しかし、「AIがあるから何でもできる」という考えは危険です。現時点ではAIはあくまで補助ツールであり、適切な使い方を理解することが重要です。
この記事では、新人エンジニアが社内開発と個人開発でAIツールをどのように活用すべきか、具体的な使い分け方法をAI(Claude)と一緒に考察してみました。
AI活用の基本姿勢
AIは思考の補助、代替ではない
AIツールを使う際に最も重要なのは、「思考停止しない」ことです。生成されたコードをそのまま使うのではなく、以下を心がけましょう:
- なぜそのコードが動くのかを理解する
- 他の実装方法と比較検討する
- セキュリティや性能面での問題がないか検証する
学習機会を奪わない使い方
新人時期は基礎力を身につける重要な時期です。AIに頼りすぎて以下の機会を失わないよう注意しましょう:
- エラーメッセージと向き合い、デバッグスキルを向上させる
- 公式ドキュメントを読む習慣をつける
- 先輩エンジニアとのコードレビューでの学び
社内開発でのAI活用戦略
社内開発では慎重かつ戦略的にAIを活用します。機密情報の取り扱いや、チーム開発での協調性を重視した使い方が求められます。
1. コード理解・読解支援
使用場面
// 既存の複雑なコードに遭遇した場合
const processUserData = (users) => {
return users
.filter(user => user.isActive && user.lastLoginDate > Date.now() - 86400000)
.map(user => ({
...user,
displayName: `${user.firstName} ${user.lastName}`,
isRecent: user.createdAt > Date.now() - 604800000
}))
.sort((a, b) => b.lastLoginDate - a.lastLoginDate);
};
AIへの質問例
このJavaScriptコードの処理内容を詳しく説明してください。
特に数値の意味(86400000、604800000)と、全体の処理フローを教えてください。
活用のポイント
- 機密情報を含まない範囲でコードの理解を深める
- 処理の意図や設計思想を理解する補助として使用
2. デバッグ支援
エラーメッセージの解釈
TypeError: Cannot read properties of undefined (reading 'map')
at processUserData (user-processor.js:15:8)
AIへの質問例
以下のエラーメッセージの原因として考えられることと、
一般的な対処法を教えてください:
[エラーメッセージをペースト]
活用のポイント
- エラーメッセージのみを共有し、実際のコードは共有しない
- 得られた回答を参考に、自分で原因を特定する
- 解決方法は複数候補を検討し、最適解を選択する
3. コードレビュー前のセルフチェック
以下のような処理を書きました。
潜在的な問題点や改善点があれば指摘してください:
[機密情報を含まないように注意して、コードを共有]
個人開発でのAI活用戦略 - 「AIファースト」で攻める
個人開発では、機密情報を気にする必要がなく、失敗も学習コストとして割り切れるため、AIツールをガンガン活用しましょう。Claude CodeやCursorなどの次世代ツールを使って、要件定義からコード作成まで全工程でAIと協働することで、現代のエンジニアに必要な「AIを使いこなすスキル」を身につけることができます。
1. 要件定義からコード作成まで全工程でAI協働
プロジェクト開始時の相談
個人の家計簿アプリを作りたいです。以下の流れで進めたいので相談に乗ってください:
1. 機能要件の整理
2. 技術スタックの選定
3. データベース設計
4. API設計
5. フロントエンド設計
6. 実装
まずは機能要件から一緒に考えてもらえますか?
Claude Code / Cursorでの実践的な使い方
# Claude Codeでプロジェクト全体を作成
claude code create-react-app my-portfolio --template typescript
# プロジェクトの説明と要件を伝える
"ポートフォリオサイトを作りたい。以下の機能が欲しい:
- ヒーローセクション
- スキル一覧
- プロジェクト展示
- お問い合わせフォーム
- レスポンシブ対応
- ダークモード切り替え
最新のベストプラクティスに従って実装してください"
2. 「動くものから理解する」学習法
推奨学習サイクル
- AIで完成品を作る:まず動くアプリケーションを完成させる
- コードを読んで理解する:なぜ動くのか、どの部分が何をしているのかを分析
- 部分的に書き直す:理解した箇所を自分なりに実装し直してみる
- 機能を追加する:AIと協働でさらに高度な機能を追加
具体例:ToDoアプリの場合
// 1. AIが生成したコード(完成形)
const TodoApp = () => {
const [todos, setTodos] = useState<Todo[]>([]);
const [filter, setFilter] = useState<'all' | 'active' | 'completed'>('all');
// ...完全な実装
};
// 2. 理解を深めるための質問
"このuseStateフックはなぜ分けて管理しているのですか?
一つのオブジェクトで管理する方法と比較してメリット・デメリットを教えてください"
// 3. 自分で書き直してみる
const TodoApp = () => {
// 状態管理を自分なりにリファクタリング
const [state, setState] = useState({
todos: [],
filter: 'all'
});
// ...
};
// 4. 機能追加
"ドラッグ&ドロップでタスクの順序を変更できる機能を追加してください"
3. 基礎理解を並行して深める重要性
AIをガンガン使いながらも、基礎理解は必須です。以下のアプローチで効率的に学習しましょう。
「なぜ?」を常に問いかける
// AIが生成したコード
const [count, setCount] = useState(0);
useEffect(() => {
const timer = setInterval(() => {
setCount(prev => prev + 1);
}, 1000);
return () => clearInterval(timer);
}, []);
// 理解を深めるための質問
"なぜsetCount内で関数を使っているのですか?
setCount(count + 1)と何が違うのですか?
useEffectの依存配列が空配列なのはなぜですか?"
段階的に自分で実装する
1. 完全にAIに任せる(Week 1-2)
→ 動くものを作り、全体像を理解
2. 一部を自分で書く(Week 3-4)
→ コンポーネントの一部を自分で実装
3. 設計から自分で考える(Week 5-6)
→ AIに相談しながら、自分で設計を立てる
4. AIをレビュアーとして使う(Week 7-8)
→ 自分で実装し、AIにレビューしてもらう
コードの背景を理解するための質問例
"このパターンが使われている理由を教えてください"
"他の実装方法と比較してください"
"このコードの潜在的な問題点はありますか?"
"パフォーマンスへの影響はどうですか?"
"実際のプロダクションでも使われる手法ですか?"
推奨AIツールと使い分け
ChatGPT / Claude
得意分野
- コードの説明・解釈
- 設計相談
- 学習計画立案
- ドキュメント作成
使用例
「Clean Architectureの概念を初心者向けに説明してください。
具体的なコード例も含めて教えてください。」
GitHub Copilot
得意分野
- リアルタイムコード補完
- 繰り返し処理の自動生成
- テストコードの生成
効果的な使い方
// コメントを書くことで意図を明確に
// ユーザーの年齢を計算する関数
function calculateAge(birthDate) {
// Copilotが実装を提案
}
Claude Code / Cursor / Codeium
得意分野
- プロジェクト全体の理解と協働開発
- 要件定義から実装まで一貫したサポート
- ファイル間の整合性を保った大規模変更
- 継続的なリファクタリング支援
効果的な使い方
# Claude Codeでのプロジェクト作成例
claude code "Next.jsでブログサイトを作成。
TypeScript、Tailwind CSS、MDXを使用。
記事一覧、記事詳細、検索機能を実装してください"
# Cursorでのリアルタイム開発
# コメントを書いてTabキーで実装を展開
// ユーザー認証のカスタムフック
const useAuth = () => {
// [Tab] → 完全な実装が展開される
}
AIツールの使い分け戦略
Claude Code
- プロジェクト全体の作成・管理
- ファイル間の整合性を保った大規模な変更
- コマンドライン操作が得意
Cursor
- リアルタイムなコード補完
- 既存コードベースとの統合
- IDEとしての使いやすさ
ChatGPT/Claude(Web版)
- 設計相談・アーキテクチャ議論
- 学習内容の整理
- コンセプトの理解
使い分けの実例
1. プロジェクト立ち上げ → Claude Code
2. 日常的な開発作業 → Cursor
3. 設計で悩んだ時 → ChatGPT/Claude
4. リファクタリング → Claude Code
5. デバッグ → Cursor + ChatGPT/Claude
注意すべきポイントと対策
1. 生成コードの検証方法
必須チェック項目
- 動作確認(テストケースでの検証)
- セキュリティリスクの確認
- パフォーマンスへの影響
- 既存コードとの整合性
検証手順
// 1. AIが生成したコード
function sanitizeInput(input) {
return input.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
}
// 2. 検証すべき点
// - XSS対策として十分か?
// - 他の危険なタグは考慮されているか?
// - 既存のライブラリの方が安全ではないか?
// 3. 改善案の検討
import DOMPurify from 'dompurify';
function sanitizeInput(input) {
return DOMPurify.sanitize(input);
}
2. 会社のAI利用ポリシー確認
確認すべき項目
- 機密情報をAIツールに入力してよいか
- 使用可能なAIツールの制限
- 生成されたコードの著作権の扱い
- チーム内での共有ルール
3. 依存しすぎないためのバランス
健全な活用のための指標
- 自力で書けるコードの割合を維持する(目安:70%以上)
- エラーの原因を自分で特定できる
- AIなしでも基本的な開発ができる
- 公式ドキュメントを読む習慣を保つ
実践的な活用例
社内開発シナリオ
状況: 先輩から「この関数のバグを修正して」と依頼された
1. まず自分でコードを読み、理解を試みる
2. 理解できない部分をAIに質問
3. デバッグの一般的な手法をAIに相談
4. 自分で原因を特定し、修正案を考える
5. 修正案をAIでレビューしてもらう
6. 先輩に相談・確認
個人開発シナリオ:AIファーストアプローチ
状況: ポートフォリオサイトを作成中
Week 1: 全体設計とプロトタイプ作成
1. Claude Codeで要件定義から設計まで相談
2. プロジェクト全体をAIに作成してもらう
3. 動作確認とデプロイまで完了
Week 2-3: 理解を深めながらカスタマイズ
4. 生成されたコードを読み込み、仕組みを理解
5. デザインや機能を自分好みにカスタマイズ
6. 「なぜこの実装なのか」をAIに質問しながら学習
Week 4: 独自機能の追加
7. 自分でアイデアを考え、AIと協働で実装
8. AIをレビュアーとして活用
9. パフォーマンス最適化をAIに相談
結果: 1ヶ月でプロダクションレベルのサイトが完成 + 深い理解も獲得
まとめ
新人エンジニアにとってAIは、学習を加速し、生産性を向上させる強力なパートナーです。しかし、最も重要なのは「AIと協力しながら、自分自身も成長し続ける」ことです。
社内開発では慎重に
- 機密情報の取り扱いに注意
- チーム開発での協調性を重視
- 学習機会を奪わない範囲で活用
個人開発ではAIファーストで
- 要件定義から実装まで全工程でAI協働
- 完成品から逆算して理解を深める学習法
- Claude Code/Cursorなど次世代ツールをフル活用
- AIを使いこなすスキル自体を身につける
AIツールは日々進化しています。常にアップデートされる情報をキャッチアップし、自分なりの活用法を見つけ続けることが、成長し続けるエンジニアになる上で重要だと考えます。
特に個人開発では、「AIをガンガン使って、動くものを作りながら理解を深める」というアプローチが、現代のエンジニアに求められるスキルセットを効率的に身につける方法ではないでしょうか。
新人だからこそ、AIを味方につけて効率的に学習し、素晴らしいエンジニアキャリアをスタートさせましょう!