JavaScript でゲームを作りたいのですが、いざプログラムを書こうとすると頭が真っ白になります

一気に作り始めるのではなく、まずはシンプルなものを作り、そこから徐々に作り込んでゆくようにすると良いでしょう。
2021年12月6日
ユーザー

はじめまして。1か月ほど前から独学でHTML、CSS、JavaScriptを勉強しています。

HTMLとCSSでゼロからよくあるレイアウトのウェブサイトを作れたり、多少複雑なコードでも何故そうなっているのかは理解できて、見よう見まねで(コードは見ずに)それっぽい感じに再現できる程度のレベルです。

プログラマー(フロントエンジニア?)として働きたいというわけではないのですが、自分でお洒落なウェブサイトや、オセロや将棋などのゲームが作れたら楽しそうだなと思い、HTML・CSSとJavaScriptの参考書を1冊ずつとドットインストール、YouTube等で勉強しています。

HTMLとCSSについては1か月ほど勉強し、手ごたえを感じているのですが、JavaScriptは現状何も身についていないと感じています。
とりあえず参考書を1冊読み、ドットインストールのいくつかの講座(Webサイトを
作れるようになろう、Webサイトに動きをつけてみよう、JavaScriptでミニアプリを作ってみよう)を一通りこなしてみました。

そして、いざ簡単なゲームを作ろうとVSCodeを立ち上げた所で頭が真っ白になってしまいました。

具体的に何を作ろうと思ったか説明しますと、
・タイピングゲーム
ページを読み込んだら画面に文字列が表示されて、指定した問題数を打ち終えると終了する。ドットインストールでもやった筈ですが、何も思い浮かばず。

・もぐら叩きゲーム
まずHTMLでTableタグを使って横3列のマスを作りCSSでそれっぽくしました。
各マスにランダムでもぐら(適当な文字列)を表示して、それをクリックするとスコアが増えて、10秒経ったら終了し、画面にスコアを表示するといったようなゲームです。
盤面を作るまではすぐ出来ましたが、JavaScriptを書こうと思ったら頭が真っ白に。

・文字列を表示できるカルーセルUI
ドットインストールのJavaScriptでカルーセルを作ろうは画像をスライドさせていましたが、画像ではなくdivタグ等で作ったひとまとまりの領域をスライドさせるような機能を実装したかったのですが、理解が足りず断念。

まだ勉強を始めて1か月程度なので、シンプルに勉強不足であることは承知しています。
今後も学習を続けていきたいのですが、”どうやって、何を勉強したらいいのか?”がわからなくなってしまっている状態です。

長くなってしまいましたが、何か助言をいただけたら幸いです。

スタッフ

こんにちは。ご質問ありがとうございました。

まだ勉強を始めて1か月程度なので、シンプルに勉強不足であることは承知しています。
今後も学習を続けていきたいのですが、”どうやって、何を勉強したらいいのか?”がわからなくなってしまっている状態です。

JavaScriptはHTML/CSSと違う考え方が必要なので最初はとまどいますよね。このあたりはコードをたくさん書いて手になじませていくしかないので、簡単なものから徐々に、という方法がいいように思えます。

JavaScriptで簡単なものといえば、まずはおみくじあたりがおすすめです。

・JavaScriptでおみくじを作ろう (全9回)
https://dotinstall.com/lessons/omikuji_js_v5

ここでは最初からおみくじを作るのではなくて、 徐々に難しくしていくのが良いでしょう。 例えば以下のような感じです。

  • 画面にボタンを配置する
  • ボタンをクリックしたら「Hello」とAlertで出す
  • ボタンをクリックしたらボタンの文字が「Hello」に変わる
  • ボタンをクリックしたらボタンの文字が1から10のランダムな整数値に変わる
  • ボタンをクリックしたらボタンの文字が「A」「B」「C」のどれかになる
  • ボタンをクリックしたらボタンの文字が「A」「B」「C」のどれかになって、Aだったらボタンの色が赤、Bだったら青、Cだったら黄色にする

あとはご自身でこういうふうに変化したらおもしろいだろうな、というアイデアを自由に試していくのがよいでしょう。

そうした練習を積み上げることにより、

  • クリックイベントの設定
  • プロパティの操作
  • クラスの操作

について学ぶことができるはずです。

またドットインストールのミニアプリのレッスンをなぞる際には、上記のように 「徐々につくっていく」のがコツです。

最初から「レッスンのように一気につくりあげるぞ!」と思わずに、「タイピングゲームだったら...まずはタイプした文字をコンソールに表示できるかどうかだけやってみよう」といった具合に 「できそうかな...」と思えるレベルまで分解してみてください。

以上がアドバイスとなりますが、他に不安に思われる点がございましたらお気軽にコメントいただければと思います。

この質問はユーザーによって解決済みになりました

このレッスンの質問と回答(158)