塾の開業活動についてはこちらをクリック!

【子ども向け】現役講師が教えるプログラミング言語を習得するための10ステップ|小学生から無料でできる完全攻略ガイド

【子ども向け】プログラミング言語を習得するための10ステッププログラミング教育
この記事は約13分で読めます。

どうもプログラミング教室で講師をしているえいとです!

プログラミング教育で何をすればいいのか分からないとお困りの方!

この記事ではパソコン未経験のお子様がプログラミング言語を習得するまでの道のりを10のステップに分けて解説します。

ステップ10までいけばクラウドソーシングなどで仕事を請け負うこともできるようになります!!

全てのステップをクリアするにはどんな子でも1年はかかると思ってください。
むしろ1年でステップ10までいけたら将来が楽しみで仕方ありません。

コツコツ1つずつステップをクリアしてプログラミング学習を迷いなく進めていきましょう!!

サクッとまとめだけ読む!

こんな方向けの記事です!
  • プログラミング教育で何をすればいいかわからない
  • プログラミング学習の進め方が知りたい
  • 最終的に子どもに言語の学習をしてほしいと思っている

 

プログラミング言語習得までの10ステップ

ここで紹介するステップはパソコンに慣れておらず、プログラミング学習もはじめての子ども向けの内容です。

お子様がクリアしていると思ったステップは飛ばして次に進んでもらって構いません。

いけそうなら次のステップにどんどん進んでいって、つまづいたら一つ戻って学習し直すなどお子様に合わせて進めていってくださいね!

プログラミング言語習得までの10ステップ
  • ステップ1:ビジュアルプログラミング言語を学ぶ
  • ステップ2:タイピングと基本的な英語を練習する
  • ステップ3:スクラッチで人の作品を模写する
  • ステップ4:わからない部分を自分で検索する
  • ステップ5:マイクラプログラミングを学ぶ
  • ステップ6:MakeCodeをJavaScriptに変換する
  • ステップ7:ProgateでJavaScriptを学ぶ
  • ステップ8:テキストエディタでJavaScriptを書く
  • ステップ9:自分のサイトを作る
  • ステップ10:ポートフォリオを作る

では一つ一つ確認していきましょう!

プログラミング言語学習の注意点はこちら
子供にプログラミング言語を学ばせてはいけない5つの理由|知らないヤバいプログラミング教育の落とし穴
子ども向けのプログラミング言語をお探しの方!ちょっと待った!小学生の子供にプログラミング言語を学ばせるべきではありません!中学生でも危険です!言語を学ぶのをオススメできない5つの理由と言語を学ぶべき子供の特徴をまとめました!

ステップ1:ビジュアルプログラミング言語を学ぶ

まずはビジュアルプログラミング言語でプログラミングを好きになってもらいましょう

苦手意識が付くと今後プログラミングをやりたいと思わなくなる可能性が高いです。
なのでまずは「プログラミングは楽しいんだ!」と思ってもらえるようにしたいです。

そこでビジュアルプログラミング言語が大活躍します。

オススメのビジュアルプログラミング言語学習のツールは次の4つです。

ビジュアルプログラミング言語学習ツール

  • スクラッチ
  • プログラミングゼミ
  • Hour of Code
  • Springin
  • スクラッチ:ビジュアルプログラミング言語の代表ソフト。子どもでも簡単にプログラミングを作ることができる。本やYouTubeなど教材が多数ある。スマホではできない。

  • プログラミングゼミ:スクラッチのようなビジュアルプログラミングが可能で、プログラミングゼミのソフト内で問題が多数用意されており、他に教材を用意しなくても学習を進めることができる。
  • Hour of Code:スクラッチのようなビジュアルプログラミングが可能。用意された問題を解きながら進める形式。オリジナルのプログラミングを作ることはできない。

  • Springin’:感覚でゲームや絵本を作ることができる。スクラッチのように命令ブロックを順番に組むのではなく、一つ一つのオブジェクトに命令を組み込む形でプログラミングを行う。iOS専用アプリ。

全てやってみてほしいですが、まずひとつ集中して取り組むならプログラミングゼミがオススメです。

PCでもスマホでも利用でき、スクラッチのようにオリジナルゲームを作ることもでき、かつプログラミング問題も豊富に用意されています。

プログラミングゼミをやりこむだけで、ビジュアルプログラミング言語は十分理解できるようになるでしょう。

詳細はこちら
【厳選】無料の子ども向けプログラミング学習アプリはこの2個でOK!|15個を徹底比較!
子ども向けの無料のプログラミング学習アプリは2個でOK!15個のアプリを実際に使って比較!広告の有無、ユーザー登録の要否、対応デバイスなどを分かりやすく表でまとめました!はじめてのプログラミング教育はスマホからでも大丈夫!!

スクラッチは教材を自分で用意しなければなりません。
レビューをよく読んで質の良い学習本を選びましょう!

Amazonで高評価のスクラッチ学習本

ステップ2:タイピングと基本的な英語を練習する

プログラミング言語は英語や記号や関数だらけです。

タイピングがある程度できるようになっていなければ、プログラミングの学習が思うように進みません。
ホームポジションに指を置いて打てるようになることを目標にタイピング練習を行ってください。

タイピング練習で有名なのは『myTyping』や『e-typing』や『寿司打』です。
myTypingでは会員登録もなしで無料で超基本的なタイピングから練習できてオススメです。

 

またローマ字はもちろんプログラミングで使う英語も理解していかないとプログラミングの学習ははかどりません。

英語の勉強についてはプログラミングで使うような英語の学習が好ましいですが、なかなかそういった教材はありません。
「for」「while」「if」「else」などよくプログラミングで使われるような英語の元々の意味を学んでいけばひとまずはOKです。

プログラミング英語検定』のサイトではプログラミングに関する英単語をまとめているので、この中からピックアップしてあげるのもオススメです。


また『D-SCHOOLオンライン』では「英語×プログラミングコース」が用意されており、家庭で月額3,980円で英語とプログラミングを同時に学んでいくことができます。

D-SCHOOLオンラインの詳細はここからチェック!
【評判】オンラインでプログラミング学習!D-SCHOOLオンラインの口コミや料金を徹底調査
オンラインでプログラミング学習ができるD-SCHOOLオンライン!コース内容、料金、無料体験、メリット・デメリット、良かった・残念だった体験談など徹底調査しました!子どもに大人気のマインクラフトや英語やロボットとプログラミングを組み合わせた独自のカリキュラムで子どもも楽しく学べます!

ステップ3:スクラッチで人の作品を模写する

ビジュアルプログラミング言語の扱いに慣れてきたら、人の作品の模写をしましょう!

プログラミング言語の学習でも人が書いたコードやウェブサイトの模写は必ず行います。

えいと
えいと

何事もマネするとこからですよね!

スクラッチで模写の練習をしましょう!
他の人がどうやってプログラミングを組み立てているのかを確認したり、高度なテクニックを学ぶことができます。

スクラッチでは公開されている作品が無限にあるので、模写をするのに適しています。
また模写ではなく、人の作品を改造することもできるので、自分のアイデアを取り入れてゲームをさらに面白くビルドアップさせる経験を積むこともできます。

トトラ
トトラ

最初は簡単なのから模写しよな!

マネするだけなので簡単そうに思いますが、高度なゲームはかなり複雑で、大人でも模写でさえ難しいものもあります。

レベルに合わせて模写するゲームを探しましょう。

ちなみに高度でヤバいゲームはこちらで紹介しています。
スクラッチのページに飛んで『中を見る』をクリックするとヤバいプログラミングを見ることができます。

プログラミングレベルが高すぎるゲーム
スクラッチのプログラミングで作れる凄いゲーム集8選!|マリオ!マイクラ!スプラ!ポケモン!
スクラッチのプログラミングで作れるすごいゲームを8つ紹介します!スクラッチは子供向けの無料のソフトですが、本気でやればニンテンドースイッチで大人気の名作ゲームを再現することができてしまいます!マリオ、マインクラフト、ポケモン、スマブラやスプラなど実際に遊んでコードを覗いちゃいましょう!

ステップ4:わからない部分を自分で検索する

模写をして、どんなことがどんなプログラミングで実現できるのかが分かってきたら、自分の作品作りに活かしましょう!

自分の作品作りのなかで思うように実現できない部分は、自分で検索して答えを探す練習をしましょう。

どうすれば正しい答えが記載されているページにたどり着けるのかを調べる、いわゆる検索力、ググり力を鍛えます。

プログラミング言語を学習する際も、検索は必須です。
それもやりたいことを実現するためのコードは1種類ではないこともあるので、いくつものサイトを探して自分の必要としている情報を見つけ出さなければなりません。

しかも丸々コピペではなく、必要なコードのみを抜き出すことが多いので、理解力も求められます。


自分一人で成長していけるように、早めにググり力を身につけていきましょう!

ステップ5:マイクラプログラミングを学ぶ

ここでは次のステップでプログラミング言語「JavaScript」を扱うための前段階としてマイクラプログラミングを学びます。

「マインクラフト for Windows」に「Code Connection」をインストールすることで『Make Code』が使えるようになります。
『Make Code』はマイクラで使えるビジュアルプログラミング言語です。

これまでのステップで学んだプログラミングの組み立て方をマイクラのプログラミングでも使ってみましょう。
プログラミングゼミやスクラッチで学んだことがここでも活かせることに気付けるはずです。

プログラミングは言語が変わっても構造が似ていることがあるので、ここでの気づきは将来にも繋がります。

マイクラの中には教材が用意されていないので、ここでも本やYouTubeで勉強していくのがオススメです。
マイクラプログラミングはYouTubeが少ないので、順序立てて学んでいくには学習本がいいでしょう。

こちらの本はD-SCHOOLオンラインのマイクラキングが著者の学習本です。

マイクラプログラミングはオンラインで学べるスクールがいくつかあります。
体系的に効率良く学習させたい方は、オンラインスクールも検討してみてください。

マイクラプログラミングのスクール比較はこちら
【7社比較】マインクラフトでプログラミングが学べるオススメのオンライン学習サービスはこれ!
オンラインでマイクラのプログラミングが学べるサービスを7つ比較しました。初心者の子どもに最もおすすめでコスパが良いのはD-SCHOOLオンライン!さらに無料でマイクラプログラミングが学べるサービスも紹介しています。

ステップ6:MakeCodeをJavaScriptに変換する

マイクラでビジュアルプログラミング言語が扱えるようになってきたら、次はいよいよプログラミング言語に触れていきます。

MakeCodeは上部にビジュアルプログラミング言語とJavaScriptを切り替えるボタンが付いています。
JavaScriptに切り替えることで今まで日本語で組み立てていたプログラムがどのようなコードで実現できるのかが分かるようになります。

次の2つの画像は「”run”というコマンドでエージェントを前に1ブロック進める」というプログラミングをビジュアルプログラミング言語とJavaScriptで表示したものです。

MakeCodeのビジュアルプログラミング画面

MakeCodeのビジュアルプログラミング画面

MakeCodeのJavaScript画面

MakeCodeのJavaScript画面

MakeCodeはJavaScriptモードでもビジュアルプログラミング言語と同じように操作してプログラミングを作っていくことができます。

どこが編集可能な部分なのか、どのような英単語を使えばいいのか、どんな書き方をしているのかなど、これまでのビジュアルプログラミング言語と比較しながら、JavaScriptを感覚的に身につけていきましょう。

えいと
えいと

ステップ5で学んだ学習内容をJavaScriptでもう一度全部やってみよう!

JavaScriptがオススメな理由はこちら
【子ども向け】おすすめのプログラミング言語はJavaScriptとPhyton!小学生向けの言語の選び方解説!
子ども向けのプログラミング言語はJavaScriptとPhytonで決まり!スクラッチでビジュアルプログラミング言語の学習を終えたら次は本格的な言語を学ぼう!小学生や中学生に最もオススメなJavaScriptを勉強して高校や大学受験に備えよう!

ステップ7:ProgateでJavaScriptを学ぶ

Progateはプログラミング初心者のための学習サイトです。
僕もJavaScriptなどを学んだときはこのサイトから学習をはじめました。

JavaScriptは様々なサイトや学習本などで初心者向けの学習内容が用意されています。
学習本でもいいのですが、環境構築などの手間を省けるので、サイトで学ぶのがオススメです。

Progate」は無料で学べる講座があり、実際にプログラムを打ち込みながら学習することができます。

途中からは月額980円を支払わなければならなくなるため、そこまで進んだら、そのままProgateで学ぶか「ドットインストール」など他のサイトで学ぶか検討しましょう。

Progateやドットインストールで一通り学習をしたら次のステップに進みましょう!

ステップ8:テキストエディタでJavaScriptを書く

ここからは完全に一からプログラミングを書いていく練習です。

テキストエディタは『Brackets』が有名です。
テキストエディタはコードを打ち込んでいくためのソフトです。

極端な話、メモ帳でもプログラミングはできますが、テキストエディタを使えば非常に効率良く楽にコードを書くことができます。


テキストエディタでコードを打ってJavaScriptを勉強していくためには、最低限のHTML/CSSの知識も必要になってきます。
またフォルダの階層構造や、文字サイズ、色コード、クラス、などプログラミングに欠かせない知識がたくさんあります。

このステップでは覚えることが一気に増えるので、体系的に学べる学習本がオススメです。
アマゾンでベストセラー入りした高評価の本など広く扱われているものを選びましょう。

Amazonでベストセラーの学習本

ステップ9:自分のサイトを作る

学習本でテキストエディタでのプログラミングにも慣れてきたら、自分のサイトを作ってみましょう!

この時、作りたい内容によってはHTML/CSSの知識も必要になるので、実現できる範囲で作るか、HTML/CSSも学んでクオリティを高めるか決めましょう。

Webサイトの運営にはHTML/CSSは欠かせないので学んでいて損はないです。

サイト作りは奥が深く、サイトのコンセプトやデザインなど多くの内容で本が一冊できてしまうほど難易度が高いものです。

ここではプログラミングの練習を行うので、コンセプトやデザインはある程度簡単なものにして、どう記述すればそれが実現できるかに時間をかけましょう!

トトラ

いきなりプロみたいなサイトは作れないもんな!

えいと

ポートフォリオサイトとかいいんじゃないかな!

テキストエディタでプログラミングしていく際には必ず「デバッグ」が必要になります。
「デバッグ」とは間違っているコードを修正することです。

最初はどこが間違えているのか探すだけでも一苦労です。
F12の「検証ツール」を使いこなして、デバッグができるようになっていきましょう!

ステップ10:ポートフォリオを作る

ポートフォリオとは自分の能力を人に見せるための作品集のようなものです。

JavaScriptで自分ができることをステップ9で作ったサイトにまとめてみてはいかがでしょうか?
勉強した成果を確認できるようにもなり、人に自分の能力をアピールするための武器にもなります。

ポートフォリオが充実してくる頃には簡単な仕事が請け負えるレベルのプログラミングスキルが身についています。

JavaScriptはできることが非常に多く、簡単に実行するためのライブラリも存在します。
『jQuery』というライブラリを使えば、プロが作ったサイトのような動きが簡単に実現できます。

ライブラリを使いこなしてサイトをリッチにしていくのも立派なプログラミングスキルです。

Progateやドットインストールでも『jQuery』の講座があるので、学習してみましょう!

まとめ

この記事では『子ども向けのプログラミング言語習得までの10ステップ』をご紹介しました。

プログラミング言語習得までの10ステップ
  • ステップ1:ビジュアルプログラミング言語を学ぶ
  • ステップ2:タイピングと基本的な英語を練習する
  • ステップ3:スクラッチで人の作品を模写する
  • ステップ4:わからない部分を自分で検索する
  • ステップ5:マイクラプログラミングを学ぶ
  • ステップ6:MakeCodeをJavaScriptに変換する
  • ステップ7:ProgateでJavaScriptを学ぶ
  • ステップ8:テキストエディタでJavaScriptを書く
  • ステップ9:自分のサイトを作る
  • ステップ10:ポートフォリオを作る

もちろん簡単な道のりではないですが、ステップをこなしていけば確実にプログラミングの力が身につきます!

高校を卒業するまでに全てのステップをこなすことを目標に、プログラミング学習をはじめてみてはいかがでしょうか。

プログラミング教育

オンラインで『マイクラ × プログラミング』するなら!

D-SCHOOL

    D-SCHOOLは
  • 14日間の無料体験あり!
  • 小学1年生から学べる!
  • 月額3980円(税込)!
    年額プランならさらにお得な2985円!

D-SCHOOLは全国約70教室を展開するプログラミング教室です。無料体験の継続率80%と満足度の高い学習内容!近くにプログラミング教室がない、費用が高くて通わせるのは難しいという方に最適です!

自宅でマイクラプログラミングが学べるオンラインスクール!

公式サイトで確認するブログ記事で評判を見てみる
\\ SHARE!! //
\\ Follow me!! //
みっけ!