JavaScript入門講座|12星座占いをつくってみよう

JavaScript
うさタブ
うさタブ

今回は星座占いをつくるッピよ~

ユウキ
ユウキ

星座占い??

うさタブ
うさタブ

今日の星座ランキング~

というアレっぴ!

うさタブ
うさタブ

何気に毎日の占いは楽しみだったりするッピよ~

ユウキ
ユウキ

機械なのにヘンなの

うさタブ
うさタブ

信じる信じないも確率論ッピ!

占いは科学ッピ!

今日の星座ランキング・サンプル

全体のコード

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
//事前の設定プログラム
let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];
let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];//4グループに分けて、ちょっと悪いとちょっと良いの間にふつうを作る
let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
]

let i = 0;//繰り返し用プログラム
let n = 0;//繰り返し用プログラム

let rank= [];//ランキングのための変数
let un = 0;//運勢を判別するための変数
let color_r = Math.floor( Math.random() * color.length);//ラッキーカラー
let un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングづけ

document.write("<p>今日の星座ランキング</p>");

 for (i=0 ;i < seiza.length;){

	n = 0;//変数をリセットします
	un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングづけ
	color_r = Math.floor( Math.random() * color.length);//ラッキーカラー

	while(n < seiza.length){
	  if (seiza[un_r] != rank[n]){n++;}
	  else {break;}
	}



	if (n >= seiza.length){

	  i++;//iにプラス1を追加する

		if (i >= 0 && i <= 2) {un = 0;}
		else if (i >= 3 && i <= 5) {un = 1;}
		else if (i >= 6 && i <= 8) {un = 2;}
		else if (i >= 9 && i <= 10) {un = 3;}
		else if (i >= 11 && i <= 12) {un = 4;} 

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のアナタの運勢は"+ un0[un] + "です</li>");
		document.write("<li>"+ un1[un] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");

	  rank.push(seiza[un_r]);//リストに記憶

	 }
	}

</script>
</body>
</html>
うさタブ
うさタブ

今回はこのコードを1からじっくり解説するッピよ~!

12星座占いの作り方

必要なもの

うさタブ
うさタブ
メモ帳
  • メモ帳
  • ブラウザ

が必要ッピ!

元になるコード

<!-- 見えない部分 -->
<html>
<head></head>
<!-- ↓ここから見える部分↓ -->
<body>

<!-- ↓この下に入力してね!↓ -->
<script>






</script>
<!-- ここまで! -->

</body>
</html>
うさタブ
うさタブ

このコードをもとに作って行くッピ!

リストで12星座とラッキーカラーをつくる

うさタブ
うさタブ

まずはリストで星座と色を登録するッピ!

<script></script>の間に

let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];

と入力するッピ!

うさタブ
うさタブ

リストは

let リスト名 = [“中身1”,”中身2”];

で作ることができるッピ!

うさタブ
うさタブ

確認として

document.write( seiza );
document.write("<br/>"); 
document.write( color ); 

と入力し、ブラウザで見てみるッピ!

document.書き出してくださいwrite HTMLに( seiza星座リストを );
document.write(“<br/>改行してください“);
document.write書き出して( colorカラーリストを );

という意味ッピ!

ユウキ
ユウキ

お、星座と色が出てきた!

うさタブ
うさタブ

さらに運勢リストを追加するッピ!

let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];

let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
];

と入力して見るッピ~!

うさタブ
うさタブ

確認として、

document.write("<br/>"); 
document.write( un0 );
document.write("<br/>"); 
document.write( un1[2] ); 

と入力して見るッピよ~

ユウキ
ユウキ

できた~!

ここまでのコード
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
//事前の設定プログラム
let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];
let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];

let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
];

document.write( seiza );
document.write("<br/>"); 
document.write( color );
document.write("<br/>"); 
document.write( un0 );
document.write("<br/>"); 
document.write( un1[2] );  

</script>
</body>
</html>

ランキング付けやラッキーカラー決める乱数をつくる

let rank= [];//ランキングのための変数
let un = 0;//運勢を判別するための変数
let un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングを選ぶ
let color_r = Math.floor( Math.random() * color.length);//ラッキーカラー

document.write("<p>今日の星座ランキング</p>");
うさタブ
うさタブ

次はこれらの【乱数】や変数を付け加えて、
ランキング付けをしたりラッキーカラーを決める方法を紹介するッピよ~

ユウキ
ユウキ

乱数って?

うさタブ
うさタブ

乱数というのは、行動するごとに変化する数 のことッピ!

サイコロや今日の運勢みたいに毎日変わる数字を【乱数】や【ランダムな数】というッピ!

ランキングづけをするための乱数

うさタブ
うさタブ

ランキングを決めるにはこの変数をつかうッピ!

let un_r = Math.floor( Math.random() * seiza.length);
うさタブ
うさタブ

これは

let un_r変数un_rをつくります = Math.floor小数点を切り捨て整数へ( Math.random()乱数をつくってください * seiza.length星座の数ぶん);

という意味ッピ!

うさタブ
うさタブ

これを星座リスト組み合わせ

let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let un_r = Math.floor( Math.random() * seiza.length);
un_r = Math.floor( Math.random() * seiza.length);
document.write("第1位" + seiza[un_r]);
document.write("<br/>");

un_r = Math.floor( Math.random() * seiza.length);
document.write("第2位" + seiza[un_r]);

とすることで、ランキングをつくることができるッピ!

ラッキーカラーを決めるための乱数

うさタブ
うさタブ

次はラッキーカラーを決める変数ッピ!

let color_r = Math.floor( Math.random() * color.length);
うさタブ
うさタブ

これは

let color_r変数color_rをつくります = Math.floor小数点を切り捨てます( Math.random乱数をつくります() * color.length色の数ぶん);

という意味ッピ!

うさタブ
うさタブ

最初の色リストと組み合わせて

let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];
let color_r = Math.floor( Math.random() * color.length);
document.write("あなたのラッキーカラーは" + color[color_r] + "です");

とラッキーカラーを決めることができるッピ!

ユウキ
ユウキ

ランキングやラッキーカラーってこうやってつくるんだな~!

繰り返し処理で12星座ぶんのランキングをつくる

うさタブ
うさタブ

次は繰り返し処理をして12星座ぶんのランキングをつくるッピよ~

ユウキ
ユウキ

なんだか難しそうだなぁ~

うさタブ
うさタブ

大丈夫ッピ!

わかりやすいように少しずつ説明するッピ~♪

うさタブ
うさタブ

星座の運勢を12回ぶん書き出すには、for文を使うッピ!

for (i=0 ;i < 繰り返したい数; i++){ 繰り返したいプログラム }

で繰り返すことができるッピ!

<script></script>の間に↓の文章を入力するッピよ~!

 for (i=0 ;i < seiza.length;){
      //ランキング付けのための変数

	un_r = Math.floor( Math.random() * seiza.length);
	color_r = Math.floor( Math.random() * color.length);

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");
		i++;
	 }
うさタブ
うさタブ

これは、

for繰り返します (i=0繰り返し初期値; i現在の繰り返し数 < seiza.length星座の数;)
{ 繰り返したいプログラムとi++;現在の書き出し数に1を追加 }

という意味で、12回分書き出すことができているッピ!

ユウキ
ユウキ

おおお! なんかたくさん出た!

これまでのコード
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
//事前の設定プログラム
let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];
let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];//4グループに分けて、ちょっと悪いとちょっと良いの間にふつうを作る
let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
]
;

let un = 0;//運勢を判別するための変数
let color_r = Math.floor( Math.random() * color.length);//ラッキーカラー
let un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングを選ぶ

document.write("<p>今日の星座ランキング</p>");

for (i=0 ;i < seiza.length;){
      //ランキング付けのための変数

	un_r = Math.floor( Math.random() * seiza.length);
	color_r = Math.floor( Math.random() * color.length);

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");
		i++;
	 }

</script>
</body>
</html>

すでにランキング入りした星座をはじく

ユウキ
ユウキ

だけどさ、うさタブ。

これランキングの中に同じ星座が2~3回入ってない?

ユウキ
ユウキ

ラッキーカラーはともかく、同じ星座が2回も3回もあるのはダメじゃないか?

うさタブ
うさタブ

任せるッピ!

すでに登録した星座をはじくプログラムをつくるッピよ~

if分岐.pushで判定ポイントをつくり、while文で12回ぶんの判定を繰り返す

うさタブ
うさタブ

登録した星座をはじくには、

新しくリストをつくって、登録したものを記録しないプログラムが必要になるッピ!

うさタブ
うさタブ

一気にコードを公開するッピよ~!

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
//事前の設定プログラム
let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];
let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];//4グループに分けて、ちょっと悪いとちょっと良いの間にふつうを作る
let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
];

let i = 0;//繰り返し用プログラム
let n = 0;//繰り返し用プログラム

let rank= [];//ランキングのための変数
let un = 0;//運勢を判別するための変数
let color_r = Math.floor( Math.random() * color.length);//ラッキーカラー
let un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングづけ

document.write("<p>今日の星座ランキング</p>");

 for (i=0 ;i < seiza.length;){

	n = 0;//変数をリセットします
	un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングづけ
	color_r = Math.floor( Math.random() * color.length);//ラッキーカラー

	while(n < seiza.length){
	  if (seiza[un_r] != rank[n]){n++;}
	  else {break;}
	}

	if (n >= seiza.length){

	  i++;//iにプラス1を追加する

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");

	  rank.push(seiza[un_r]);//リストに記憶

	 }
	}

</script>
</body>
</html>
ユウキ
ユウキ

おお! ぜんぜんかぶらない!
どうやったんだよ! うさタブ!?

うさタブ
うさタブ

ふふふ、どうやったかこれから説明するッピ!

新しくリストをつくり .push で追加する

うさタブ
うさタブ

まずは新しいリストと変数づくりッピ!

let rank= [];//ランキングのためのリスト変数
rank.push(seiza[un_r]);//リストに記憶

で最初にリストをつくり、

ランキング1位・2位などの<ul><li></li></ul>グループを書き出したあと

rank.pushリストrankに追加してください(seiza 星座の中の[un_rランダムで選んだ星座]);

rank= [] ;ランキング入りした星座を記録するッピ!

whileとif文で登録しているか判別する

うさタブ
うさタブ

さらにif文ですでにこの星座がランキングに登録しているかを判別するッピ!

うさタブ
うさタブ

まずは i に代わる繰り返し用変数 n を用意するッピ!

n = 0;//変数をリセットします

さらに↓のプログラムで登録するか判別するッピよ~

while(n < seiza.length){
	  if (seiza[un_r] != rank[n]){n++;}
	  else {break;}
	}
うさタブ
うさタブ

これは

while繰り返してください(n < seiza.length星座の数ぶん){
ifもしも (seiza[un_r]ランダムで選んだ星座が != rank[n]登録されていないなら){n++; nに1を繰り返してください}
else登録しているものなら {break;プログラムを中断してください}
}

という意味ッピ!

うさタブ
うさタブ

さらに

if (n >= seiza.length){
	  i++;//iにプラス1を追加する

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");

	  rank.push(seiza[un_r]);//リストに記憶
	 }

と書き出しのコードを変更することで、今まで登録していない星座を記録することができるッピ!

うさタブ
うさタブ

これは

ifもしも ( n登録判別が >= seiza.length終了しているなら ) {
i++i に1を追加して;
rank.rankリストにpush 追加してください (seiza星座の中から[un_rランダムで選んだものを]);
}

という意味ッピ!

ユウキ
ユウキ

なんだか複雑だなぁ

うさタブ
うさタブ

いくつものプログラムの応用ッピ!

混乱するのも意味ないッピよ~

うさタブ
うさタブ

流れとしては

 for (i=0 ;i < seiza.length;){//12星座ぶんのランキング

	while(n < seiza.length){//すでに登録しているかを判別
	  if (seiza[un_r] != rank[n]){n++;}
	  else {break;}//登録しているなら中断
	}

	if (n >= seiza.length){//登録していないなら動作
	  i++;//ランキングの順位を増やす
	  rank.push(seiza[un_r]);//リストに登録する
	 }
}

という感じッピ!

ユウキ
ユウキ

うーん

わかったような・・・わからないよ~な?

ランキングの順位から運勢を決定する

うさタブ
うさタブ

最後にランキングの順位から運勢を決定するプログラムを作るッピ!

うさタブ
うさタブ

運勢を決定するにはif文を作るッピよ~

//運勢を決めるためのif文
     if (i >= 0 && i <= 2) {un = 0;}
else if (i >= 3 && i <= 5) {un = 1;}
else if (i >= 6 && i <= 8) {un = 2;}
else if (i >= 9 && i <= 10) {un = 3;}
else if (i >= 11 && i <= 12) {un = 4;} 

これを書き出しプログラムの前に追加するッピ!

さらに書き出しプログラムに運勢を書き出すコードを書き加えるッピ~

	document.write("<li>今日のアナタの運勢は"+ un0[un] + "です</li>");
	document.write("<li>"+ un1[un] +"</li>");
if (n >= seiza.length){

	  i++;//iにプラス1を追加する

		if (i >= 0 && i <= 2) {un = 0;}
		else if (i >= 3 && i <= 5) {un = 1;}
		else if (i >= 6 && i <= 8) {un = 2;}
		else if (i >= 9 && i <= 10) {un = 3;}
		else if (i >= 11 && i <= 12) {un = 4;} 

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のアナタの運勢は"+ un0[un] + "です</li>");
		document.write("<li>"+ un1[un] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");

	  rank.push(seiza[un_r]);//リストに記憶

	 }
ユウキ
ユウキ

おおお! 運勢が追加されてる!

リストとランキングの順位で運勢を決める

うさタブ
うさタブ

運勢を決めるには、あらかじめ運勢コメントをリストつくっている必要があるッピ!

let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];//4グループに分けて、ちょっと悪いとちょっと良いの間にふつうを作る
let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
];
let un = 0;//運勢を決める変数
うさタブ
うさタブ

さらにランキングを順位づけに必要な変数 i これを使って運勢コメントを判別するッピ!

うさタブ
うさタブ

これは

ifもしも (iランキング順位が >= 0 0以上 && でさらに  i <= 22以下なら) {un = 0;変数unは0です}
else ifもしもそれ以外で (i >= 3 && i <= 5) {un = 1;}
else if (i >= 6 && i <= 8) {un = 2;}
else if (i >= 9 && i <= 10) {un = 3;}
else if (i >= 11 && i <= 12) {un = 4;}

という意味ッピよ~!

うさタブ
うさタブ

最後に

un0[un] //ざっくりとした運勢
un1[un] //運勢コメント

で運勢を呼び出せば完成ッピ!

全体のコードの確認

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
//事前の設定プログラム
let seiza = ["おひつじ座","おうし座","ふたご座","かに座","しし座","おとめ座","てんびん座","さそり座","いて座","やぎ座","みずがめ座","うお座",];
let color = ["赤","青","緑","黄色","紫","ピンク","茶","白","黒",];
let un0 = ["最高","良い","ふつう","ちょっと悪い","サイアク",];//4グループに分けて、ちょっと悪いとちょっと良いの間にふつうを作る
let un1 = [
"今日のアナタは絶好調!何をやってもうまくいきます。苦手なことに再チャレンジしたら案外うまくいくかも!",
"今日は調子が良い日。久しぶりに昔の友だちに連絡してもるのもいいかも!",
"今日はとてもいつもどおりな日。気を抜きすぎて寝坊をしやすくなるかも?",
"今日はなんだか気分が良くない日。忘れ物には気をつけて!",
"今日は何もせずゆっくりしているのが良いかも・・・",
];

let i = 0;//繰り返し用プログラム
let n = 0;//繰り返し用プログラム

let rank= [];//ランキングのための変数
let un = 0;//運勢を判別するための変数
let color_r = Math.floor( Math.random() * color.length);//ラッキーカラー
let un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングづけ

document.write("<p>今日の星座ランキング</p>");

 for (i=0 ;i < seiza.length;){

	n = 0;//変数をリセットします
	un_r = Math.floor( Math.random() * seiza.length);//運勢をランキングづけ
	color_r = Math.floor( Math.random() * color.length);//ラッキーカラー

	while(n < seiza.length){
	  if (seiza[un_r] != rank[n]){n++;}
	  else {break;}
	}

	if (n >= seiza.length){

	  i++;//iにプラス1を追加する

		if (i >= 0 && i <= 2) {un = 0;}
		else if (i >= 3 && i <= 5) {un = 1;}
		else if (i >= 6 && i <= 8) {un = 2;}
		else if (i >= 9 && i <= 10) {un = 3;}
		else if (i >= 11 && i <= 12) {un = 4;} 

	//書き出しのプログラム
		document.write("<ul>");
		document.write("<li>第"+ i +"位"+ seiza[un_r] +"</li>");
		document.write("<li>今日のアナタの運勢は"+ un0[un] + "です</li>");
		document.write("<li>"+ un1[un] +"</li>");
		document.write("<li>今日のラッキーカラーは"+ color[color_r] +"です</li>");
		document.write("</ul>");

	  rank.push(seiza[un_r]);//リストに記憶

	 }
	}

</script>
</body>
</html>
学習のまとめ
  • リスト配列で星座をつくる
  • ラッキーカラーをつくる
  • 乱数で運勢を決める
  • if / for / while文でランキングづけする

うさタブ
うさタブ

上手くできたッピか?

これからも色んなゲーム作りやプログラムの解説をしていくッピ!

次回も楽しみにしているッピよ~~!

スポンサーリンク
スポンサーリンク
スポンサーリンク

どうしてもわからない、そんなときは?

ユウキ
ユウキ

うーん・・・

やっぱり、どうしてこーなるか良くワカンナイな~

説明を聞いたすぐはわかったつもりなんだけどさ

アイカ
アイカ

そうね・・・わたしも

先生やうさタブさんにすぐに聞ける環境じゃないから

宿題とか困っちゃうわ・・・

ユウキ
ユウキ

他に気軽に教えてくれる先生とかいるといいんだけどな~

うさタブ
うさタブ

フムフム!

そんなときは、プログラミング教室がオススメッピね~

アイカ
アイカ

そんなのあるのか?

ていうかドコいけばいいんだよ

うさタブ
うさタブ

それなら、やっぱり一番安心自宅近所の教室がよいッピ!

うさタブ
うさタブ
テレビや雑誌に紹介された超有名教室
QUREOプログラミング教室とかどうッピか?

うさタブ
うさタブ

未来都市キュレオを舞台に、魅力的なキャラクターがたくさん登場する・ゲーム感覚で楽しく学べるプログラミング教室ッピ!

困ったことも先生に直接聞けるのが最高ッピ~!

うさタブ
うさタブ

全国2500教室もあるから、

きっとみんなの近くにも教室があるッピ。

公式サイト近くに教室があるかチェックしてみるとよいッピ!

ユウキ
ユウキ

なんだこれ! スゲーなっ

ゲームみたいにやってるうちに、自然と勉強できてるみたいな感じ?

アイカ
アイカ

そんなものがあるのねっ!

うさタブ
うさタブ
キュレオプログラミング教室は、
アメーバブログやアベマTV・バンドリをプロディースしている
サイバーエージェント」のグループ会社で、確かな実績があるッピ!

うさタブ
うさタブ

オンラインで授業を受けるなら

Tech Kids Online Coachingがオススメッピ!

こっちもサイバーエージェントのグループ会社が運営してるッピ!

教室名 対象 学習言語 教室場所 無料体験・カウンセリング
 

「QUREOプログラミング教室」

小学2年生〜中学3年生 Scratch
HTML/CSS
JavaScript
全国各地
教室
無料体験◯
 

Tech Kids Online Coaching

小学1年生〜中学3年生 Scratch
C++
Unity
渋谷
またはオンライン
無料体験◯
 

Udemy

社会人 HTML/CSS
JavaScript
Python
講座購入
ブラウザ
アプリ
サンプル等◯
うさタブ
うさタブ

パパやママ、お兄ちゃんお姉ちゃん
就活や転職で役立つプログラミング知識を身につけたいなら
Udemy】で講座のコースを買ってみるのもオススメッピ!

動画付きの魅力的な教材が格安で、好きな時間に学べるッピ~

うさタブ
うさタブ

ちびっこのみんな、スクールで
自分以外の同い年と一緒に勉強することで、自分も負けないゾ!と思えて
おサボりを防ぐことができるッピ!
さらに、クラスのみんなと差をつけてすごいプログラムが作れちゃうッピ

先生やパパママにほめられて、学習効率が最高にグングン↑↑ッピよ~~♪

ユウキ
ユウキ

よーし、ちょっと体験だけでもやってみるか!

アイカ
アイカ

わたしもさっそくチェックしてみようかな♪

スポンサーリンク

どうしてもわからない、そんなときは?

ユウキ
ユウキ

うーん・・・

やっぱり、どうしてこーなるか良くワカンナイな~

説明を聞いたすぐはわかったつもりなんだけどさ

アイカ
アイカ

そうね・・・わたしも

先生やうさタブさんにすぐに聞ける環境じゃないから

宿題とか困っちゃうわ・・・

ユウキ
ユウキ

他に気軽に教えてくれる先生とかいるといいんだけどな~

うさタブ
うさタブ

フムフム!

そんなときは、プログラミング教室がオススメッピね~

アイカ
アイカ

プログラミング教室??

アイカ
アイカ

そんなのあるのか?

ていうかドコいけばいいんだよ

うさタブ
うさタブ

プログラミング教室は、やっぱり安心の近所の教室ッピ!

うさタブ
うさタブ

テレビや雑誌に紹介された超有名教室

プログラミング教室数国内No.1!「QUREOプログラミング教室」
とかどうッピか?

うさタブ
うさタブ

未来都市キュレオを舞台に、魅力的なキャラクターがたくさん登場する・ゲーム感覚で楽しく学べるプログラミング教室ッピ!

困ったことも先生に直接聞けるのが最高ッピ~!

うさタブ
うさタブ

全国2500教室もあるから、

きっとみんなの近くにも教室があるッピ。

公式サイト近くに教室があるかチェックしてみるとよいッピ!

ユウキ
ユウキ

なんだこれ! スゲーなっ

ゲームみたいにやってるうちに、自然と勉強できてるみたいな感じ?

アイカ
アイカ

そんなものがあるのね

うさタブ
うさタブ
「QUREOプログラミング教室」は、
アメーバブログやアベマTV・バンドリをプロディースしている
サイバーエージェント」のグループ会社で、実績があるッピ!

うさタブ
うさタブ

オンラインで授業を受けるなら

Tech Kids Online Coachingがオススメッピ!

こっちもサイバーエージェントのグループ会社が運営してるッピ!

教室名 対象 学習言語 無料体験・カウンセリング
 

「QUREOプログラミング教室」

小学2年生〜中学3年生
教室で授業を受けたい方
Scratch
C++
JavaScript
無料体験◯
 

Tech Kids Online Coaching

小学生~中学生
オンライン授業を受けたい方
Unity
C++
Scratch
無料体験◯
Udemy
社会人
講座コースで勉強したい人向け
HTML/CSS
JavaScript
Python
サンプル等◯

うさタブ
うさタブ

パパやママ、お兄ちゃんお姉ちゃん
就活や転職で役立つプログラミング知識を身につけたいなら
Udemy】で講座のコースを買ってみるのもオススメッピ!

動画付きの魅力的な教材が格安で、好きな時間に学べるッピ~

うさタブ
うさタブ

ちびっこのみんなは、スクールで
自分以外の同い年と一緒に勉強することで、自分も負けないゾ!と思えて
おサボりを防ぐことができるッピ!
さらに、クラスのみんなと差をつけてすごいプログラムが作れちゃうッピ

先生やパパママにほめられて、学習効率が最高にグングン↑↑ッピよ~~♪

ユウキ
ユウキ

よーし、ちょっと体験だけでもやってみるか!

アイカ
アイカ

わたしもさっそくチェックしてみようかな♪

JavaScriptJSゲームJSゲームテクニックプログラミング
学んで遊んでジャンケンポン!
タイトルとURLをコピーしました