ゲーム作成
【22 | フォーム作成】 ホーム】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング 「frontend/game.js」ファイルを編集します。 記述編集 【Desktop/RailsGame/frontend/game.js】 // initilize context kaboom({ scale: 3, width: 2…
【21 | スコアボードのデータ取得】 ホーム】 >> 【23 | プレイヤー名登録】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング Bootstrapを使用できるようにし、ユーザー情報を入力するフォームを作成します。 「frontend/index.html…
【20 | APIテスト】 ホーム】 >> 【22 | フォーム作成】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング データベースからスコアボードのデータをゲームで取得できるようにします。 frontend側で作業します。 「frontend/game.js」…
【19 | backendの設定】 ホーム】 >> 【21 | スコアボードのデータ取得】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング backend側のVisual Studio Codeで拡張機能「Thunder Client」をインストールします。 Thunder Client インス…
【18 | スコアボード】 ホーム】 >> 【20 | APIテスト】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング backend(Rails側)の設定を進めていきます。 ルートの設定 「config/routes.rb」ファイルを編集します。 記述編集 【Desktop/R…
【17 | 魔法の実装】 ホーム】 >> 【19 | backendの設定】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング スコアボードを実装します。 「frontend/game.js」ファイルを以下のように編集します。 記述追加 【Desktop/RailsGame/fron…
【16 | 魔法使いのステータス】 ホーム】 >> 【18 | スコアボード】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング 魔法使いが、火の玉（ファイヤー）を飛ばすよう実装します。 「frontend/game.js」ファイルを編集します。 記述編…
【15 | 魔法使い追加】 ホーム】 >> 【17 | 魔法の実装】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング 魔法使いのステータスを追加します。 「frontend/game.js」ファイルを以下のように編集します。 記述編集 【Desktop/RailsGa…
【14 | 最終マップの動作】 ホーム】 >> 【16 | 魔法使いのステータス】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング 最終マップ上に魔法使いを追加します。 「frontend/game.js」ファイルを編集します。 記述編集 【Desktop/Rai…
【13 | 最終マップに宝箱追加】 ホーム】 >> 【15 | 魔法使い追加】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング 宝箱の前でスペースを押すと、宝箱が開くようにします。 「frontend/game.js」ファイルを以下のように編集します…
【12 | 難易度調整】 ホーム】 >> 【14 | 最終マップの動作】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング 宝箱を配置します。 「frontend/game.js」ファイルを編集します。 記述編集 【Desktop/RailsGame/frontend/game.js】 //…
【11 | 次のマップレベルへの動作】 ホーム】 >> 【13 | 最終マップに宝箱追加】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング ゲームの難易度を調整します。 「frontend/game.js」ファイルを編集します。 記述編集 【Desktop/Rai…
【10 | 敵を追加】 ホーム】 >> 【12 | 難易度調整】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング マップレベル１の動作を実装していきます。 「RailsGame/frontend/game.js」ファイルを編集します。 記述編集 【Desktop/RailsGa…
【09 | プレイヤーの動作】 ホーム】 >> 【11 | 次のマップレベルへの動作】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング シーンに敵を追加します。 「frontend/game.js」ファイルを以下のように編集します。 記述編集 【Desktop…
【08 | プレイヤー追加】 ホーム】 >> 【10 | 敵を追加】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング プレイヤーの動作を修正します。 「RailsGame/frontend/game.js」ファイルを編集します。 記述編集 【Desktop/RailsGame/fro…
【07 | フロアマップ】 ホーム】 >> 【09 | プレイヤーの動作】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング プレイヤーをシーンに追加します。 「RailsGame/frontend/game.js」ファイルを以下のように編集します。 記述編集 【D…
【06 | スタート画面】 ホーム】 >> 【08 | プレイヤー追加】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング フロアマップを作成します。 「RailsGame/frontend/game.js」ファイルを以下のように編集します。 記述編集 【Desktop/R…
【05 | Spritesとゲームリソース】 ホーム】 >> 【07 | フロアマップ】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング スタート画面を作ります。 「frontend/game.js」ファイルを以下のように編集します。 記述編集 【RailsGame/fr…
【04 | 開発スタート】 ホーム】 >> 【06 | スタート画面】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング Spritesとは、コンピュータ上で動く図形を表現する際に、動かす図形と固定された背景とを別に作成し、ハードウェア上で合…
【03 | アプリケーション作成】 ホーム】 >> 【05 | Spritesとゲームリソース】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング デスクトップに作成した「RailsGame」フォルダ内に「frontend」フォルダを作成します。 frontendフォ…
【02 | Rails7.0のインストール】 ホーム】 >> 【04 | 開発スタート】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング アプリケーション名「backend」を作成します。 作成コマンドは、「RailsGame」フォルダで行います。 コマンド r…
【01 | 開発環境を整える】 ホーム】 >> 【03 | アプリケーション作成】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミング まずデスクトップにアプリケーション用のフォルダを作成します。 今回、名前を「RailsGame」にしました。 Vis…
【ホーム】 >> 【02 | Rails7.0のインストール】 ↓↓クリックして頂けると励みになります。ランキング参加中プログラミングRuby on Rails7.0の開発環境を整えます。 MacOSXでRuby on Railsの開発環境を整えるために必要となるのは「Postgresqlのインストール…
