プログラミングに挑戦しよう!

独学でWebアプリが作れる!
初心者におすすめの動画学習サービス

詳細はこちら

【2024オールスター出場選手クイズ】HTML/JSで作った野球アプリ!

クイズ

プロ野球ファンのみなさん、2024年のオールスターゲームは楽しめましたか?
私は普段、阪神タイガースの勝敗に一喜一憂していますが、オールスターは贔屓抜きで純粋に野球を楽しめるので好きです。

さて今回は、プログラミング学習の一環として「オールスター出場選手クイズ」を作ってみました!
出場選手がどの球団に所属しているかを当てるだけのシンプルなクイズです。

プロ野球に詳しい方には簡単すぎるかもしれませんが、ちょっとした暇つぶしにぜひどうぞ!

このクイズは、HTML・CSS・JavaScriptを使って作成しました。
使った教材は、動画で学べる学習サービス「Udemy(ユーデミー)」です。

これからプログラミングを始めてみたい方や、実際に何が作れるのか気になる方は、私が使った講座をぜひチェックしてみてください👇

※このリンクは広告です(アフィリエイトリンク)

【世界で90万人が受講】Web Developer Bootcamp(日本語版)をUdemyで見る icon

💸 セール情報
Udemyではほぼ毎月セールが開催されていて、タイミング次第で90%OFF以上の割引も!
受講を考えている方は、ぜひセール期間を狙って購入するのがおすすめです。

2024オールスター出場選手クイズをやってみよう

ここから実際に2024オールスター出場者クイズに挑戦できます👇

全問正解めざして頑張ろう!

2024オールスター出場選手クイズの遊び方

セ・リーグかパ・リーグか、クイズに挑戦したいリーグをクリックしましょう。

セ・リーグを選択すると、セ・リーグの選手名とチーム名が表示されます。
正解だと思うチームをクリックしてください。

全部で31問あり、出題順はランダムになってます。
右上の×印を押すと最初の画面に戻ります。

いずれかのチームをクリックすると正誤判定画面に変わります。
正解だとこのような画面になります。

間違えた場合は正解のチームを教えてもらえます。

「次の問題」ボタンを押すと次の問題が表示されます。
同じ選手は出題されないように設定しています。

31人全員答えたら「次の問題」ボタンが「結果発表」ボタンに変わります。
結果発表ボタンを押すと正解数が表示されます。

今回は31問中25問正解でした。

「もう一回」ボタンを押すと最初の画面に戻ります。

全問正解できなかった方は、全問正解を目指してみてはいかがでしょうか。
違うリーグのクイズに挑戦するのもありです。

ちょっとでも「こんなクイズ作ってみたいかも」と思った方は、
Udemyの講座でプログラミングを始めてみてください。

私が受講した講座はこちら👇

※このリンクは広告です(アフィリエイトリンク)

【世界で90万人が受講】Web Developer Bootcamp(日本語版)をUdemyで見る icon

💸 セール情報
Udemyではほぼ毎月セールが開催されていて、90%オフになることもあります。
購入するならセール期間が断然おトクです!

タイトルとURLをコピーしました