yarn create @phaserjs/game

今度は、 Project名を Dewmo001とでもして、
Demo Game (Matching Pairs, Clicker, Shmup) を選択

一番上のDemoを選ぶ。
作成されたら、フォルダに移動して、 yarn install でモジュールのインストール
yarn run dev で起動します。

20秒間、敵が上下繰り返すのでマウスクリックで玉をうちこみ、当てたら 敵も玉をうってくるので、それを上下に移動してかわしながらどれくらい得点をのばせるかというゲームのようです。

どうように次のDemoを作成してみます。
次のゲームは、コインクリッカーというゲームで、上からふってきて、地面にぶつかったら跳ね返る動きをするのでクリックして、コインをとっていくゲームですね。

どうように最後のDemoを作成してみます。
記憶するゲームのようですね。

１２枚のカードで、２枚選び絵が一致したら、カードをとりのぞいていき、全部なくしたら終了。
また、ミスすするとハートがへっていくので、ハートを多く残してクリアするってゲームのようですね。

ここらへんのサンプルも含めて、解析していろいろ調べていくか・・

ひな形を使ってプロジェクトをつくっていく。

作成

実行すると、プロジェクト名を聞かれるので適当に入力します。

次に、Demo Game(３つ選べる)か Client Framework か Web Bundler　の選択画面になります。

大規模なJS書いたことないんで、フレームワークさわっていないので、
Frameworkは軽くスルーして・・・

Web Bundlerを選択。
ひとまず、webpackを選択。

今度は、最小限の設定か、一通り設定された完成されたプロジェクトかを選べるので、
いろいろ込々のComplete Projectを選択

最後に TypeScriptか JavaScriptか聞かれます。おすきなほうを…

? We anonymously record which template was selected to help guide development.
If you don't agree, press N to Quit. Otherwise, press Y. » (Y/n)
どのテンプレート選んだのか、匿名で情報を蓄積するけどいいよね？　と言われるので、どうぞどうぞの Y で。

そうするとこんな感じのひな形が作られます

プロジェクト作成に成功したら次のステップとして３つ書かれています。
フォルダに移動して、モジュールをインストールして、実行してみるってことですね。

指示どおり、フォルダに移動し、yarn installでインストールを行い
yarn run devで実行

バンドルして開発用サーバーが起動し、ページを開いてくれます。

最初のひな型は、MainMenuシーン(クリック) → Gameシーン(クリック) → GameOverシーン(クリック) → MainMenuシーン
と設定されているようです。

しばらくこれを使って、使い方を探っていきます。

forループでループを抜けきったらelseに入ることを利用して
elseでcontinueしておけば、内側のループがすべて実行されたことになり
breakで抜けた場合はelseを通過しないのでその先のbreakでぬけることで
ループをぬけれる。
下記は、各要素の合計が30を超えるのであれば抜ける処理

dataList = [
        [2, 4, 5, 6],
        [6, 4, 1, 5],
        [3, 1, 3, 1]
    ]

sum = 0
for rowData in dataList:
    for value in rowData:
        print("Next", value)
        if 30 < sum + value: 
            break
        sum += value
        print(sum)
    else:
        continue
    break;