Claude Codeでコーディングなしで放置型RPGウェブゲームを作る

Claude Code、Vite、TypeScript、HTML5 Canvasを活用して、モバイル縦画面の放置型RPGゲームをゼロから完成まで制作します。自動戦闘、ガチャシステム、装備強化などの核心的なゲームシステムを段階別に実装し、将来的にGoogle Playでのリリースまで可能な実戦的なウェブゲーム開発プロジェクトです。

1名 が受講中です。

難易度 中級以上

受講期間 無制限

TypeScript
TypeScript
canvas
canvas
mobile
mobile
game-engine
game-engine
vite
vite
TypeScript
TypeScript
canvas
canvas
mobile
mobile
game-engine
game-engine
vite
vite

受講後に得られること

  • TypeScriptベースのゲームアーキテクチャ設計およびCanvasレンダリングエンジンの実装

  • ガチャ・強化・放置報酬など、RPGの核心システムのデータモデリングとバランシング

  • localStorageベースのゲーム状態管理およびCapacitorを通じたモバイルアプリビルド


Claude Codeで 放置型RPGウェブゲームを作る?

コーディングなしで
Claude Code(クロードコード)に言葉で指示して、

TypeScript + Phaser 3でモバイル放置型RPGウェブゲームを最初から最後まで完成させます。


企画から開発、そしてリリースまで!

魅力的なゲームシステムの構築方法を学びたいですか?

オートバトル、ガチャ、強化などのコア機能を直接作ってみてください。

直接コードを一行ずつタイピングすることはありません。AIコーディングエージェントのClaude Codeに韓国語でリクエストし、出力された結果を一緒に検討・修正しながら実際に動作するゲームを作っていきます。

オートバトルループの設計からガチャの確率テーブル、装備強化、スキルの自動発動、クエスト・ダンジョン・ショップ、放置(オフライン)報酬まで — 放置型RPGの核となるシステムを一つずつ直接実装します。さらに、キャラクター/モンスターのスプライトアニメーション、3重のパララックス背景、コードで合成したサウンドまで加え、完成度の高いゲームへと仕上げます。


Claude CodeでWeb放置型RPGの自動戦闘、ガチャ、強化システムを
実装する方法を学び、プレイヤーとモンスタースプライト

背景、サウンドまで直接作ってみます。

この講義が終わる頃には、あなたは


Claude Codeで自分だけのWeb放置型RPGゲームを直接完成させることができます。

  • コーディングの経験が少なくても大丈夫です。Claude Codeの直感的なインターフェースを活用し、ゲームの企画から自動戦闘、ガチャシステム、装備強化など、RPGの核となるロジックまで段階的に実装しながら、自分だけのゲームを完成させる体験ができます。ゲーム開発の全過程を直接経験し、成果物を手にすることになります。


✔️

この講座が、あなたの放置型RPGウェブゲーム開発の夢を現実に変えてくれます。

Claude Codeで作る
自分だけの放置型RPGウェブゲーム

本講座では、コーディングなしでClaude Codeを活用し、TypeScript、Vite、HTML5 Canvasを用いてモバイル放置型RPGウェブゲームをゼロから完成まで制作する過程を詳しく解説します。自動戦闘、ガチャ、装備強化などのコアシステムの構築から、Google Playへのリリースまで可能な実践的な経験を積むことができます。

TypeScriptとCanvasで実装するRPGコアシステム

TypeScriptベースのゲームアーキテクチャ設計とCanvasレンダリングエンジンの実装を直接経験し、ガチャ、強化、放置報酬などRPGの核心的なデータモデリングとバランシングを実習します。localStorageを利用したゲーム状態管理やCapacitorを通じたモバイルアプリのビルドまで、実際のプロジェクトにすぐ適用可能な技術を習得します。

実践プロジェクトの完成コードおよびリソース

講義で使用されるすべてのClaude Codeプロジェクトファイルと関連リソースを提供します。自動戦闘、ガチャシステム、プレイヤーおよびモンスターのアニメーション、背景の適用など、完成したゲームの全ソースコードを通じて学習内容を深め、自分だけのアイデアを追加してゲームを発展させることができます。


📚

コーディングなしで完成させる
自分だけの放置型RPGウェブゲーム!

セクション 1

放置型RPGウェブゲーム開発を始める

本セクションでは、Claude Codeを使用して放置型RPGウェブゲーム開発のための基本環境を構築し、ゲームの企画から自動戦闘、ガチャシステムの実装まで、核心機能を段階別に学習します。プレイヤーおよびモンスタースプライトのアニメーション適用、背景の挿入、サウンドポリッシングなど、ゲームの基本的な完成度を高める過程を扱います。


このような方々の悩みを
解決できます!

📌

フロントエンド開発者
TypeScriptとCanvas APIを活用して、臨場感あふれるウェブゲームを自分で作ってみたいが、どこから始めればいいか分からず途方に暮れている方


📌

ゲーム開発入門者
コーディングの経験はあるが、ゲームエンジンを使わずにHTML5 CanvasとTypeScriptだけで完成度の高いモバイルウェブゲームを作る具体的なプロセスを学びたい方


📌

インディーゲーム開発者
放置型RPGジャンルの魅力にハマり、自分だけのゲームを直接企画・実装したいけれど、コーディングの壁によってアイデアを現実に移せずにいる方


この講座で作るもの

  • Phaser 3 戦闘画面 + DOM/CSS メニュー ハイブリッド構造 (モバイル 9:16 縦長画面)

  • 自動戦闘ループ: 登場 → 自動攻撃 → 撃破 → 次の敵、ダメージ数値/クリティカル演出

  • ガチャ(武器召喚):ランク別確率、10連ガチャ、重複 → 強化石還元

  • 装備・強化: 強化石消費、成功/失敗確率、攻撃力増加

  • スキルシステム: 6スロット、クールダウン・マナ、自動キャスト、AOE/ドット/バフ/ヒール

  • 成長: レベルアップ、永久ステータス育成

  • コンテンツ: 反復クエスト、デイリーダンジョン、ショップ、放置報酬(最大24時間)

  • 通貨表記: 万・億・兆の韓国式単位 + インフレ対応

  • スプライトアニメーション: プレイヤー/モンスターのidle・attack・hurt・death、フレーム分析とアンカー整列

  • 演出: Autumn Forest パララックス背景 + タイルセットの床、Web Audio 合成 SFX/BGM

  • 保存: localStorage自動保存 (IndexedDBに交換可能な抽象化)


💡 この講座ならではの強み — "実践デバッグ"

講義はハッピーパス(正常系)だけを見せるものではありません。実際に発生したバグをClaude Codeと共に診断・修正する過程をそのまま盛り込みました — 一撃で死ぬモンスターによるNullPointerクラッシュ、放置報酬後の画面フリーズ、スプライトアンカーのずれ、タイルのグリッドの継ぎ目など。AIにどのように問題を説明し、原因を絞り込んでいくかが本当の核心的な能力です。ワンテイク・編集なしの講義です。

このような方におすすめ

  • Claude CodeのようなAIコーディングツールで、実際に成果物を作ってみたい方

  • 放置型RPGを自ら企画・実装してみたいインディーズゲーム入門者

  • Phaser 3 + TypeScriptで2Dウェブゲームの構造を学びたいフロントエンド開発者

事前知識(あれば役立つ、必須ではない)

  • HTML/CSS/JavaScriptを見たことがあれば、結果の検討がスムーズになります

  • TypeScriptは知らなくてもついていけるように進めますが、基本概念を知っていればよりスムーズです

  • コードを直接書くのではなく、Claude Codeに指示・検討する方式なので、コーディング経験が少なくても大丈夫です





受講前のご案内


実習環境

  • OS:Windows、macOS、Linuxのすべてで使用可能です。

  • 必須ツール:VS Code (Visual Studio Code) コードエディタが必要です。

  • PCスペック:スムーズな開発のために8GB以上のRAMを推奨します。

事前知識および注意事項

  • Web開発の経験があれば、大きな助けになります。

  • TypeScriptとJavaScriptの基本内容を理解していることが望ましいです。

  • オブジェクト指向プログラミングの概念を理解していると望ましいです。

学習資料

  • 最終プロジェクトファイルを提供します。

  • Claude Codeの使用方法に関する資料を参考にすることができます。



こんな方に
おすすめです

学習対象は
誰でしょう?

  • Web開発の経験があり、ゲーム開発に挑戦したいフロントエンドエンジニア

  • TypeScriptとCanvas APIを活用した実践プロジェクトを求める中級開発者

  • 放置型RPGジャンルのゲームメカニクスを直接実装してみたいゲームプランナーおよび開発者

前提知識、
必要でしょうか?

  • JavaScript/TypeScriptの基本文法とES6+モジュールシステムの理解

  • HTML5 Canvas APIの基礎、または2Dグラフィックスレンダリングの経験

  • ViteやWebpackなどのモダンなビルドツールの使用経験

こんにちは
kosartです。

キャリア認証

1,025

受講生

57

受講レビュー

53

回答

4.3

講座評価

20

講座

コーディング士官学校 ハードトレーニング

社会人・学生・インディーズ開発者が集まって勉強しています。

私は主にJava、またはゲームプログラミングのポートフォリオ過程を講義しています。

ブロックチェーン取引所、証券取引所、ゲームサーバー、ゲームクライアントの会社勤務および外注開発

ゲーム開発およびゲーム教育会社の代表

塾の講義およびフリーランスの外注、インディー開発

(Unity Korea 大韓商工会議所 エティバースラーニング) Unityブートキャンプ オフライン講義

Unity Certified Instructor

コンテンツ人材キャンプ(洪陵)Unity講義など、多数の開発および講義経歴

現役開発者およびインディーズ開発者とKOSATチームの研究開発講義活動

 Unity Certified Professional: Programmer

멋쟁이사자 (Like Lion) 教育講師

コサトインディチーム 受講生3人チーム

111パーセント、30億支援「スーパーファスト・バッチ」

2期優勝

 

新しいインディチーム第2期募集開始

 

 

もっと見る

受講レビュー

まだ十分な評価を受けていない講座です。
みんなの役に立つ受講レビューを書いてください!

kosartの他の講座

知識共有者の他の講座を見てみましょう!

似ている講座

同じ分野の他の講座を見てみましょう!

期間限定セール

¥15

48%

¥4,884