見出し画像

[JavaScript/Canva] ゲームクリアするとガチャ回せる仕組みを作ってみた

サイトで用意しているクイズで一定スコア以上をとると、ガチャを回す仕組みを作っていこうと思います!

前回までの記事


ゲームクリアすると、ガチャでモンスターをゲットできる仕組みを作る

イメージは以下。
ガチャでゲットしたモンスターは一覧画面で確認できるような仕組みもあわせて作っていきます。

設計検討

ガチャのHTMLは既に作成済みですので、ランダムでモンスターを取得し、そのモンスターをデータベースに登録する箇所の設計をざっくり整理していきます。

設計イメージは以下の青い箇所

プログラミングする

上記の設計メモを参考に青い箇所をプログラミングしていきます!事前に設計メモをまとめると、手戻りも少なく、効率よく実装できるかと思います。

クイズ画面(クリアするとボーナスガチャ画面)

以下は、クイズ画面のURLで、クイズをクリアできるとモンスターをゲットできるガチャが回せます!ぜひやってみてもらえると嬉しいです!

いいなと思ったら応援しよう!