0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Claude Codeでじゃんけんゲームを進化させた話

Posted at

初めの文章

今日はプログラミング初学者が知っておくべき
AIツールを使ったプログラミングを記事にしました。
これまでコードを一行一行手で書くのが当たり前だと思っていたかもしれません。
でも、ここで多くの人がこう思います。

「Claude CodeみたいなAIツールって、実際のプログラミングでどう使えばいいの?」

Claude Code画面

①.jpeg

そこで今日のゴール

「AIツールを使ったプログラミング」が「実際のコード作成にどうつながるの?」を
 ざっくりと理解すること。

  • ちょっと付いて来れない所もあるかもしれないんですけど、それでいいんです。
  • なんかこんな感じで動いてるんだなっていう雰囲気が分かればOKです。

まず最初に

今までのプログラミングは、
基本的に手動でコード作成手動でテストで開発していました。

  • プログラマーが「この機能が欲しい」と考えて、「一行一行コードを書く」
    「動作確認をする」の繰り返しで、時間をかけてソフトウェアを作っていました。

それをClaude Codeでどうやるのか?

サンプルの開発例

79行の普通のじゃんけんゲームを、
 471行のRPG風ゲームに改造したい場合。

79行の普通のじゃんけんゲーム(文字のみ)

じゃんけん_6.jpeg

ステップ1:現状分析

  • 従来の方法:手動でコード一行一行を読んで問題点(画面が地味など)を探す(30分〜1時間)
  • Claude Code: コマンドで「分析して改善提案」を指示(1分)
bash> analyze current_janken.rb and suggest improvements

  ↓
 AIが自動で分析して改善点を教えてくれます。

※補足:コマンド自体は英語ですが、指示内容は日本語でもOKです。
 (ステップ2、3も同様です)

# こんな風に日本語でも指示できます
> current_janken.rbを分析して改善点を提案して下さい

コマンド入力画面

②.jpeg

ステップ2:機能追加

  • 従来の方法:統計機能、色付け、エラー処理を一つずつコーディング(2〜3時間)
  • Claude Code:日本語で要求を伝えるだけ(5分)
create enhanced_janken.rb with win/loss/draw statistics, colorized output

 ↓
 AIが240行の改良されたコードを自動生成してくれます。

コマンド入力画面

②.jpeg

ステップ3:環境整備

  • 従来の方法:Gemfileの書き方を調べて、依存関係を手動管理(30分)
  • Claude Code:必要なファイルを自動生成(2分)
create Gemfile with colorize gem for colored terminal output

 ↓
 AIが必要なファイルを自動作成してくれます。

 ※補足:Gem
  Rubyで使える「便利な道具」のことです。
   例:colorize gem = 「文字に色をつける道具」
     スマホのアプリみたいなものです。

 ※補足:Gemfile
  「このゲームにはこの道具が必要ですよ」という買い物リストです。
  他の人がゲームを動かすときに、同じ道具をダウンロードできます。

コマンド入力画面

③.jpeg

実際のコード生成例

従来の手動コーディング

# 30分かけて手動で書いたコード
class Statistics
  def initialize
    @wins = 0
    @losses = 0
    # ...(中略)...
  end
end

Claude Codeによる自動生成

# 1分で自動生成されたコード(エラー処理付き)
class Statistics
  attr_reader :wins, :losses, :draws, :total_games

  def initialize
    @wins = 0
    @losses = 0
    @draws = 0
    @total_games = 0
    load_stats  # JSONファイルから自動読み込み
  end

  def get_rank
    return "🔰 初心者" if @total_games < 5
    return "🥉 ブロンズ" if win_rate < 30
    # ...(ランキング機能も自動実装)...
  end
end
  • AIが要求を理解してコードを生成します。
  • 人間がコードを確認して次の改良を依頼します。

開発時間の比較

作業内容 従来の手動開発 Claude Code使用
現状分析 30分〜1時間 1分
統計機能実装 1〜2時間 5分
UI改善(色・絵文字) 1時間 3分
データ永続化 2時間 5分
ランキングシステム 3時間 10分
合計 7〜9時間 24分

最後に

AIツールを使用すると簡単にコード作成できます。
しかし、闇雲にAIツールに頼ると基礎力不足で酷い目に遭います。
実際のWebアプリケーション開発ではデータベースやフロントエンドなどが
あり複雑さが増し、エラー解決や、解決方法を人に説明する力も必要です。
作成されたコードが何を意味するのか、出来る限り理解して、
AIツールを使いこなしていきましょう。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?