教材の内容に関係のない質問や教材とは異なる環境・バージョンで進めている場合のエラーなど、教材に関係しない質問は推奨していないため回答できない場合がございます。
その場合、teratailなどの外部サイトを利用して質問することをおすすめします。教材の誤字脱字や追記・改善の要望は「文章の間違いや改善点の指摘」からお願いします。
基本的な操作のみ可能なシンプルなテトリスです。下記機能の実装は行っておりません。
最初に表示される画面です。ユーザ名を入力する画面となります。
実際にテトリスが遊べる画面です。画面には 3 つの状態があります。
ゲーム開始時に表示される画面です。画面右下の ゲームスタート
をクリックしてテトリスを開始できます。
テトリスを遊ぶための画面です。方向キーやスペースキーでブロックを操作することができます。
テトリスの続行が不可能になった際に表示される画面です。再度テトリスを遊ぶには、画面右下の ゲームスタート
をクリックする必要があります。
本教材を通して作れるようになるテトリスは netlify で下記にデプロイされています。
https://vue-typescript-tetris.netlify.app/
上記図のような画面遷移を実現するための状態管理については後述の章で詳細を説明します。