型9: 基本的なファイル作成
クラス: 初心者
所要時間: 約30分
前提知識: 型1〜8 完了済み
1. 解説
Claude Code によるファイル作成の仕組み
Claude Code にファイルを作成させると、内部では Write ツールが呼ばれる。 既存ファイルへの変更は Edit ツールが使われる。
新規ファイル作成 → ● Write: path/to/file.js
既存ファイル編集 → ● Edit: path/to/file.jsファイル作成の指示パターン
bash
# パターン1: ファイル名と内容を指定
「src/utils.js を作成してください。内容は〜」
# パターン2: 目的から生成させる
「ユーザー認証を行う auth.js を src/ に作成してください」
# パターン3: テンプレートから展開
「Express のルーターファイルのテンプレートを routes/users.js として作成してください」
# パターン4: 既存ファイルを参考に作成
「src/userService.js と同じ構造で src/productService.js を作成してください」良いファイル作成指示の要素
✅ ファイルパス(どこに作るか)
✅ ファイルの目的・役割
✅ 含めるべき関数・クラス・変数
✅ 使用する技術・ライブラリ
✅ コーディング規約(インデント、セミコロンなど)2. 実践
Step 1: シンプルなユーティリティファイルを作成
bash
mkdir -p ~/claude-practice/lesson9/src
cd ~/claude-practice/lesson9
claudesrc/stringUtils.js を作成してください。
以下の関数を含めてください:
- capitalize(str): 文字列の先頭を大文字にする
- truncate(str, maxLen): 文字列を指定文字数で切り詰め、末尾に「...」を付ける
- countWords(str): 単語数を返す
各関数に JSDoc コメントを付けてください。Step 2: 複数ファイルを一度に作成
以下の2ファイルを作成してください:
1. src/mathUtils.js
- add, subtract, multiply, divide 関数
- divide は0除算でエラーをスロー
2. src/arrayUtils.js
- unique(arr): 重複を除いた配列を返す
- flatten(arr): ネスト配列をフラットにする
- groupBy(arr, key): オブジェクト配列を指定キーでグループ化するStep 3: 設定ファイルを作成
package.json を作成してください:
- name: "lesson9-practice"
- version: "1.0.0"
- main: "src/index.js"
- scripts: start, test
- 依存パッケージはなしStep 4: エントリーポイントを作成
src/index.js を作成してください。
stringUtils, mathUtils, arrayUtils を require して、
各モジュールの関数を1つずつ動作確認するコードを書いてください。動作確認:
bash
node src/index.js3. 確認課題(Assignment)
課題 9-1: README.md の自動生成
前の手順で作成したプロジェクトに対して:
このプロジェクトの README.md を作成してください。
以下のセクションを含めてください:
- プロジェクト概要
- インストール方法
- 使い方(各モジュールの使用例)
- 関数一覧達成条件: 実際に作成されたすべての関数が README.md に記載されていること
課題 9-2: テスト雛形の作成
src/stringUtils.js の各関数に対する Jest テストファイル
tests/stringUtils.test.js を作成してください。
各関数に対して最低2つのテストケースを含めてください。達成条件: テストファイルが作成され、関数ごとにテストケースが存在すること
課題 9-3: 既存ファイルを参考にした作成
src/mathUtils.js を参考にして、同じ構造の src/statisticsUtils.js を作成させよ。
src/mathUtils.js と同じコーディングスタイルで src/statisticsUtils.js を作成してください。
以下の関数を含めてください:
- average(arr): 平均値
- median(arr): 中央値
- variance(arr): 分散達成条件: mathUtils.js と統一されたスタイルで statisticsUtils.js が作成されること
