表示モード

ブロックくずしを作ろう ​

このチュートリアルでは、 Akashic Engine を使用してブロックくずしを作成する方法をステップバイステップで学びます。 作成したゲームは ニコニコ生放送 で遊ぶことはもちろん、単体のブラウザゲームとして公開することもできます。

JavaScript を含めた Web 技術についての疑問があれば、まずは MDN (Mozilla Developer Network) を参照することを推奨します。 調べたいこと mdn のように調べたい単語とともに mdn を足して検索することも有効です。

各章の最後にはコード付きの実行サンプルが用意されています。 コードを書きながら、実際にゲームを動かしてみて、ゲーム作りについて学んでいきましょう。

本チュートリアルの想定読者 ​

JavaScript について、if や for など基本的な構文をある程度理解できることを前提としています。

また、コマンドプロンプト (Windows) やターミナル (macOS) などの端末エミュレータをある程度操作できることを前提としています。 コマンドプロンプトやターミナルを使う場面では「次のコマンドを実行してください」というような言い方をしています。

本チュートリアルの想定環境 ​

開発で用いる OS については Windows または macOS それぞれの最新版を前提としています。 また、ブラウザについては Chrome、Firefox、Edge、Safari それぞれの最新版を前提としています。 これらとは異なる環境においては、ゲームが正常に動作しない可能性があることをご了承ください。

本チュートリアルの見方 ​

本チュートリアルは実際に JavaScript のコードを書きながら進めていきます。 コードを書き写す際は、なるべくコピーペースト機能を活用しましょう。

コードについては、以下のように各行の左側に + や - 記号の付いたシンタックスハイライトで表示している場合があります。 + がついた行は 追加する行、 - が付いた行は 削除する行 を示しています。

以下の例では、 削除するコード と書かれた行を削除し、その部分に 追加するコード を追加しています。

既存のコード
削除するコード
追加するコード

これはつまり、

既存のコード
削除するコード

というコードを

既存のコード
追加するコード

のように修正することを意味しています。

また、コードの随所に ... という表記を使用しています。

javascript
if (条件) {
    ...
}

これは、追加するコードとは無関係の部分においてのみ、コードの内容を省略していることを示しています。 コピーペーストする際は ... の部分まで含まないように注意してください。