みなさんこんにちは!おさかなです!
今回は「ぷよぷよプログラミング」について、書いていこうと思います!
それでは、レッツゴー!!!!!
・ぷよぷよでプログラミングを学びたい方
・ゲーム感覚で学習したい方
・学校のプログラミング学習教材を探している方
「ぷよぷよプログラミング」って何?
「ぷよぷよプログラミング」とは、ソースコードを写経して「ぷよぷよ」を動かしながらプログラミングが学べるサービスのことです!小・中・高の学習教材として活用したり、e-sports大会も開催されたりと今大注目の教材です!(すごい!)


実際に使ってみよう!
事前準備
それでは早速サイトにアクセスしましょう!

学べるコースは4種類あり、それぞれ入力行数が異なります。
- 基礎コース … 4行
- 初級コース … 28行
- 中級コース … 95行
- 上級コース … 1015行(全て)

ページをスクロールして「START」ボタンをクリックしましょう!(ポチっと)

するとページが遷移するので、右上の「ログイン」または「アカウント作成」から、アカウントを用意します。(よいしょ!)

ログインした状態で「ぷよぷよプログラミングに挑戦」という項目まで、ページをスクロールします。

学習の進め方がまとめられている「ガイド小冊子」と、「ソースコード一式」があるので、事前にダウンロードしておきましょう!(はい!)

ガイド小冊子の中身は、こんな感じです!(おお!)

アルル可愛い…!(アイスストーム❄)

ソースコード一式はこんな感じです!(ふむふむ…。)


(一旦休憩…🍮)
学習を開始しよう!
4つのコースの中から好きなものを選択して、学習を開始しましょう〜!(※今回は基礎コースです)

このような画面が開くので「インポート」を押します。

「ぷよぷよプログラミング基礎」というメニューが表示されるので、選択します!(エイ!)

続いて「クラウドIDEで開く」を押します。

すると…?
こんな感じで、プログラムを記述する「エディタ」が起動しました!(おー!)

「ガイド小冊子」を参考に、SESSION1「ぷよぷよ」が落ちてくるを進めてみたいと思います…!(わくわく!)

まずは、左側のツリービューから「src」>「player.js」ファイルを開きます。

今回は基礎コースのため、入力が必要なのは「189行目」のコードのみになります!(なるほど!)

ソースコードを実際に入力して…。

ショートカットキー「Ctrl」+「S」または「保存」ボタンで、セーブします!(ゴー!!)

すると…?
右側の「出力画面」にぷよぷよが落ちてきました!(すごい!)

しかし…!
このままでは落ちてくるだけで、すぐにゲームオーバーになってしまいます。(困った💦)

そこで、次のSESSION2「ぷよ」を左右に動かすを進めます!(よし!)

基礎コースは「280行目」のコードが必要になります!(ぐっぐぐー♪)

同じようにソースコードを記述すると…?

こんな感じで!ぷよを左右に移動できるようになりました!(いい感じ!)

…といった感じで、学習を進めていきます!(楽しい!)
このままだと「ぷよを揃えても消えない」ので、気になる方は実際に遊んでみてください🌸

↓日経ソフトウエア 2021年3月号でも「ぷよぷよプログラミング」が特集されています。

遂にぷよぷよもプログラミング時代に突入したのか…。

子供も楽しく学べそう!!
これで全ての操作は完了です。(やった~!)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました!
