トランプのカードを一枚表示する(記号は数字で表示しよう)

チャプター1神経衰弱ゲームの内容を確認しよう

トランプのカードにはスペード、ハート、ダイヤ、クラブ、の四種類のスート（絵柄マーク）があり、
それぞれに A、2、3、4、5、6、7、8、9、10、J、Q、K、の13の「ランク」（番号）の計52枚のカードがあります。
（ジョーカーは除きます）

カードをバラバラに裏向きに並べて、二枚のカードをめくります、二枚のカードの番号が違った場合は裏に戻します。
めくったカードが同じ番号であれば、そのまま表のままにして、また次の二枚を表にすることができます。
すべてのカードを表に出来るまで繰り返します。

チャプター2カードクラスを作ろう

カードのクラスを作ってキャンバスに一枚の白いカードを長方形の図形で表示できるようにしましょう。
カードの一枚の横幅は60px、高さは90pxで作ってください。
キャンバスのサイズはもカードと同じサイズでかまいません。

2. 1 ヒント

• createCanvas()キャンバスの作成
• rect() 四角形の描画(第五引数を指定すると角を丸める事が出来てよりトランプのカードらしくなる)
• class クラスの作成

チャプター3カードにスートの番号を表示しよう

カードにスートのかわりになる番号を表示してみましょう。
(今後番号から絵柄に変換する機能を作ります)
カードの左上に引数で指定した数字を表示できるようにしてください。数字の色は黒にします。

3. 1 ヒント

• text()文字の描画
• textSize()文字のサイズ
• textAlign()アラインの設定
• fill()塗り色の設定

チャプター4カードにランクの番号を表示しよう

スートと同様にカードにランクのかわりになる番号を表示してみましょう。
(今後番号からランク記号に変換する機能を作ります)
カードの中央に引数で指定した数字を表示できるようにしてください。
数字の色は一先ず黒にします。