IT ゲーム

ぷよぷよプログラミングの用語をプログラマーが小学生でもわかるように解説

ぷよぷよプログラミング用語解説

  • ぷよぷよプログラミングやってみたい!
  • でもIT知識が全然ない!
  • ぷよぷよプログラミングを始めるのに必要な知識を知りたい!

今回はこのようなことを考えている人向けの記事です。

どうも!プログラマーの てぃかし です!

ぷよぷよプログラミングとは、アクションパズルゲーム「ぷよぷよ」を題材にしたプログラミング学習ができる教材です。

冊子に記載されたコードを書き写すことで、プログラミングに慣れ親しむことができるので、特に子供の教材として人気です。

以前、ぷよぷよプログラミングの始め方・やり方について解説しました。

ぷよぷよプログラミング
ぷよぷよプログラミングの始め方・動かし方・遊び方と改造・実行方法解説

プログラミングに触れてみたい。 ぷよぷよプログラミングってなんだ? どうやって始めるの? ぷよぷよプログラミングの遊び方は? 今回はそんな疑問をもっている人向けの記事です。 どうも!エンジニアの てぃ ...

続きを見る

この記事の通りに進めることで、ぷよぷよプログラミングをスムーズに学習できます。

しかし、ぷよぷよプログラミングの教材の中で出てくる語句や用語についてよくわからず、あまり意味がわからず学習を進めてしまう人もいるようです。

それでは、せっかく勉強したのにもったいないです。

ただ、文字を入力するだけでもプログラミングに慣れ親しむことができますが、学習中に出てくるIT系の用語や語句について知っておいた方が絶対良いです。

今回は、ぷよぷよプログラミングの教材で出てくる用語や語句をエンジニア経験のある僕が小学生でもわかるように簡単な言葉で解説します。(わかりやすさ重視のため簡略化して説明します。)

  • ぷよぷよプログラミングをこれから始めようと思っている人
  • ぷよぷよプログラミングを教材として子供たちに教える人

特にこのような人はぜひこの記事を参考にしてください。

プログラミング

プログラミングとは、

「コンピュータに行わせる処理を記述したもの(プログラム)を作成すること」

です。

このプログラムは、人間が作成します。

プログラムは、基本的に英語で書きます。

ぷよぷよプログラミングでは、お手本が用意されていますが、基本となるファイルである「index.html」には、下記のように文字が記載されています。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta http-equiv="Content-Security-Policy" content="default-src * data: gap: content: https://ssl.gstatic.com;
style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
<title>ぷよぷよプログラミングを体験してみよう! </title>
<script src="components/loader.js"></script>

<以下略>

アルファベットがずらずらと並んでいます。

プログラミングとは何か?もう少し詳しく知りたい人は、下記の記事をご参考ください。

プログラミングとは
プログラミングとは?仕事と小学校での違いをわかりやすく簡単に解説

プログラミング入門者 プログラミングって何だろう? プログラミングで何ができる? 「仕事で使うプログラミング」と「子どもが学ぶプログラミング」の違いって何? もしかして今、この記事を読んでいる人はこん ...

続きを見る

ソースコード

このような文字の集まりを「コード」、「ソースコード」、「ソース」と呼んだりします。

ソースコードは、プログラムの設計図のことです。

コーディング

コードを打つことをコーディングと言います。

ぷよぷよプログラミングの教材で出てくる用語なので覚えておきましょう。

写経

コーディングと似たような意味で「写経(しゃきょう)」という言葉があります。

コーディングは、ソースコードを書くことです。

写経は、書き写すことです。何かを見ながらコーディングすることをぷよぷよプログラミングでは写経と言っています。

HTML

先ほど、例に挙げた「index.html」は「HTMLファイル」というものです。

HTML(エイチティーエムエル)とは、HyperText Markup Language(ハイパーテキストマークアップランゲージ)の略で、インターネット上のページを表示するためのものです。

HTMLファイルに記載した内容がページに現れます。

例えば、

<p>おはよう</p>

と書くと、

おはよう

と表示されます。

ちなみに、ぷよぷよプログラミングの教材では、「HTML5」と書かれていますが、「5」はバージョンのことです。

Webページ

インターネット上のページのことを「Webページ(ウェブページ)」と呼んだりします。

今見てるページもWebページです。

Webとは、World Wide Web(ワールドワイドウェブ)の略です。

JavaScript

JavaScript(ジャバスクリプト)とは、インターネット上のページに動きをつけるためのプログラミング言語です。

HTMLファイルの中に<script>というタグを入れて、そのタグの中にJavaScriptを書くパターンと「xxx.js」といったファイルの中にJavaScriptを書くパターンがあります。

ぷよぷよプログラミングでもJavaScriptは使われていますが、仕組みは小学生くらいの子供には理解が難しいかと思います。

なので、ぷよぷよプログラミングでは、そこまでJavaScriptの理解はできなくても良いと思います。

JavaScriptのコードの中の一部をいじって、ぷよぷよを動かせたら上出来でしょう。

CSS

CSS(シーエスエス)は、Webページを装飾するためのものです。

HTMLとセットで使用されます。

HTMLの中に目印になるclass(クラス)といったものを書いておいて、そのclassの文字や背景を赤くするなどといったことができます。

例えば、HTMLに

<p class="apple">りんご</p>

と書いておいて、CSSで

.apple { color: red; }

と書くと、「りんご」という文字が赤くなります。

HTMLやCSSについては下記の記事でも説明しているので、興味のある人はこちらもご参考ください。(HTML、CSSの基礎は理解している人向けの記事です。)

初心者向け要約!HTML&CSSとWebデザイン入門講座をエンジニアが解説
【初心者学習】要約!HTML&CSSとWebデザイン入門講座本をエンジニアが解説

HTML&CSSとWebデザインを勉強したい。 HTML&CSSとWebデザイン入門講座ってどうなの? 学習内容は、実務で役立つ? 今回はこのような疑問を持っている人向けの記事です。 どうも!書籍「H ...

続きを見る

Windows・Mac・Chrombook

ぷよぷよプログラミングで必要な物として、

Windows、Mac、Chrombook のいずれかのPCまたはスマホ

が必要であるという記載があります。

これらは、パソコン(PC)の種類のことです。(「OS」とも言います。)

パソコンは、これら以外のものを使用している人はほぼいないでしょう。

なので、ぷよぷよプログラミングをする上ではあまり気にすることはありません。

読み方は、Windows(ウインドウズ)、Mac(マック)、Chormbook(クロムブック)です。

iOS・Android・タブレット

iOS・Android・タブレットも使用できると記載があります。

iOSは、iPhoneのスマホ

Androidは、Androidのスマホ

タブレットは、少し大きなスマホ

だと考えてもらっても構いません。(厳密には違いますが。)

これらを使ってもぷよぷよプログラミングを学習することは可能ですが、

やはり学習するならパソコンを使うのがおすすめです。

両手でタイピングする練習にもなるからです。(「タイピング」は、文字を打つことです。)

ブラウザ

「ブラウザ」あるいは「ウェブブラウザ」とは、パソコンやスマホを利用してインターネットのページを見るためのソフトです。

GoogleChrom、Mozilla Firefox、Microsoft Edge、Safariなどがあります。

どれも無料でインストールができます。あるいは最初からインストールされいます。

ぷよぷよプログラミングはブラウザ上で操作ができます。

メールアドレス

ぷよぷよプログラミングを始める上で必要な物の1つとして、メールアドレスがあります。

メールを送ったり、受け取ったりするためにメールアドレスは必要ですが、

ぷよぷよプログラミングに登録するためにもメールアドレスは必要です。

メールアドレスは、GmailやYahoo!メールなどがありますが、Gmailは他のサービスでもよく使うので、メールアドレスをまだ持っていない人は、Gmail(Googleのメール)を作っておきましょう。

Gmailの作り方は、下記の記事をご参考ください。

Gmail使い方の基本
Gmailの始め方と基本的な使い方&便利技(PC編)|新人・初心者向け

Gmailの始め方を教えてほしい! Googleアカウントを作りたい! Gmailの基本的な使い方や機能についても教えてほしい! GoogleアカウントとGmailアカウントの違いがよくわからん… 今 ...

続きを見る

英数字半角

英数字半角は、

abcdefghijklmnopqrstuvwxyz1234567890

といった文字です。

プログラミングでは、基本的に英数字半角を使用します。

全角を使用するとエラーになります。

よく間違えることとして、数字の半角と全角があります。

1234567890

↑これは半角ですが、

1234567890

↑これは全角です。

パソコンやスマホによって、半角、全角の切り替えの仕方は異なるので、自分の持っているパソコンあるいはスマホがどのように半角と全角を切り替えるのか調べておきましょう。

プログラミングするときの基本となることであり、初心者がつまづきやすい所でもあるので、注意しましょう。

大文字・小文字

プログラミングでは、大文字と小文字を区別することがあります。(区別されないこともあります。)

自分のパソコンでの大文字、小文字の打ち方を知っておきましょう。

基本的には普段は、小文字を入力し、大文字を使用したいときだけ「shift」ボタンを押しながら、文字を入力したら大文字が打てるように設定されているかと思います。

インデント

インデントとは、字下げのことです。

プログラミングは、改行してコードを入力していきます。

別に改行しなくてもプログラムは動くのですが、人間が見てわかりやすいように改行を入れます。

ただ、改行を入れるだけでなく、行の最初に空白を入れることで、コードのまとまりが理解しやすくなります。

この行の最初に入れる空白のことを「インデント」と言います。

下記はぷよぷよプログラミングのサンプルコードのindex.htmlですが、空白があります。(ピンクの箇所)

インデント

これは見やすくするために入れてます。

インデントがあっても、なくても、プログラムの動作は同じです。

コメント「//」

プログラミングにおいて、「コメント」と言えば、コードに記述する説明文のようなものを意味します。

「このコードは〜の役割をしているよ!」といったことをコメントとして、残しておけば、他の人が見てもコードの意味をすぐに理解できます。

コメントがなければ、どういう仕組みなのか理解するのに結構時間がかかることもあります。

自分が書いたコードであっても、数ヶ月もすれば、何のために書いたコードか忘れていることがあります。

そういう時に備えて、未来の自分にコメントを残すという人もいます。

コメントの書き方はルールがあり、そのルールを守れば、そのコメントはプログラム上では無視されます。なので、何を書いてもいいのです!

コメントの仕方は、扱うプログラミング言語によって異なります。

htmlでは、

<!-- コメント -->

と書きます。(「コメント」の部分に好きな文字を書く)

JavaScriptでは、

// コメント

と書いたり、

/* コメント */

と書いたり、

/*
コメント
コメント
*/

と書いたりします。

ぷよぷよプログラミングのサンプルコードにもコメントが書かれていますが、

「何だこれ?こんなの書いてあるのにプログラムは動くのかー?」

など思わないようにしてくださいね。

IDE(統合開発環境)

IDEとは、プログラミング言語を書くためのメモ帳のようなものです。

Visual Studio、Xcode、Atomなどがあります。

ぷよぷよプログラミングでは、「MonacaクラウドIDE」 という専用のIDEを使用します。

ブラウザ上で使用ができるので、面倒な設定はほぼ不要で始められます。

img・src

MonacaクラウドIDEを開くと、img、srcといったフォルダがあります。

IDE

「img」は「image」のことで、画像を指します。

「img」というフォルダに画像を入れるという決まりはありませんが、たいてい「img」「image」などといったフォルダ名にします。

「src」は「source」のことです。

sourceとは、外部から読み込む資源(ファイル)などの所在を意味します。

ぷよぷよプログラミングではsrcフォルダには、JavaScriptのファイル「jsファイル」が入っています。

png

imgフォルダの中には、「●●●.png」といったファイルがあります。

これは画像です。

画像は他にも、jpg、jpeg、といったものがあります。

セミコロン ;

セミコロンとは、「;」の記号のことです。

セミコロンは、CSSでよく使われています。

一つ記号がないだけで、エラーを引き起こすので侮れません。

ちなみに「:」はコロンです。

ショートカットキー

ショートカットキーは、操作を短縮するためのボタン操作です。

例えば、

【Ctrl+C】 コピー

【Ctrl+V】 貼り付け

【Ctrl+Z】 元に戻す

などがあります。

パソコンの種類によってどのボタンを押すかは異なるので、ショートカットキーを知りたい人は、調べておくと良いでしょう。

おすすめプログラミングスクールとおすすめ記事

今回は、ぷよぷよプログラミングの用語をプログラマーが小学生でもわかるように解説してみました。

今回解説した内容は、ぷよぷよプログラミングをする人はもちろん、これからプログラミングを勉強してみようと思っている人は、ぜひ知っておきたい内容です。

本記事をお気に入り登録して、また復習することをおすすめします。

プログラミングを本格的に勉強したい子供、または勉強させたいと思っている保護者の方は、下記の子供向けのおすすめプログラミングスクールの記事もご参考ください。

小学生向けプログラミング教室
小学生・中学生向けプログラミング教室まとめ!オンライン学習の料金相場と内容

小学生向けのプログラミング教室ってどんなところがある? 子供はプログラミングスクールでどんな内容を学ぶ? オンラインスクールの料金相場はいくら? そもそも子どもにプログラミングを習わせることは必要? ...

続きを見る

本記事を読んだ人は、以下の記事もおすすめです。そちらもぜひご覧ください。

子どものプログラミング学習
子供がプログラミングを学ぶのは意味ない?小学校で学習する内容とは

子供がプログラミングを学ぶのは意味がない? 小学校のプログラミング授業はどんな内容? プログラミング教室で学習した方が良い? 今回はそんな疑問を持っている人向けの記事です。 どうも!プログラマーの て ...

続きを見る

プログラミング言語ランキングまとめ
プログラミング言語ランキングまとめ【おすすめ・特徴・年収一覧】

プログラミング初心者 ・プログラミング言語ってどんなものがある? ・どれを勉強するのが良い? ・人気のある言語、年収の高い言語ってあるの? 今回はこのような疑問を持っている方に役立つ記事となっています ...

続きを見る

MacBookかWindows
プログラミングにおすすめなパソコンはMacBook?Windows?メリットデメリットを紹介

パソコン買うか迷ってる人 プログラミングの勉強をしたいと思うけど、パソコンは何が良いのだろう? Mac?それともWindows? それぞれのメリット・デメリットを知りたいな。 今回はそんな悩みを解決す ...

続きを見る

オンラインのプログラミング学習サイト
【初心者おすすめ勉強法】オンラインのプログラミング学習サイトまとめ(無料&有料)

プログラミングの学習サイトってどんなものがあるのだろう? オンライン完結で学習をしたい。 初心者向けの学習手順を知りたい。 今回はそんな疑問に答える記事となっています。 プログラミングを勉強しようと思 ...

続きを見る

YouTubeでも役立つ情報を配信しています!

ボタンをクリックしてチャンネル登録お願いします!

-IT, ゲーム
-, , ,

© 2022 てぃかしのブログ Powered by AFFINGER5