みなさん、暑い日が続きますね。モモです。
今日は、わかこく流「確実に」プログラマーになる学習ステップを紹介していきます。
ＷＥＢ制作で、在宅から活動・仕事をする私たちにとっては、不可欠の基礎スキル、それがプログラミングなんです( ﾟДﾟ）
プログラミングは、もともと専門学校とかで学ぶものではないのかのぉ。ワシは、不安じゃよモモちゃん。
だいじょうぶです。このブログに書いてある通りに突き進んでもらえたら、プログラミングができるようになるんです！
わしはクマじゃし、森の学校でも成績が悪かったんじゃぁ。不安で仕方がないのぉ
プログラミングを独学する、というのは実は「続けること」が難しいんです。 プログラムそのものは、けっして難しくないんですよ。
でも、その「続けること」を実行するために、今日は動画でステップを紹介していきたいと思います
ステップ１．学び方を学ぶ
まず、はじめに見ていただきたいことは、「学び方」を教えてくれている動画です。 ここではやっぱり、マナブさんの動画をオシたいと思います。
マナブさんは動画の中で、単にプログラミングのテクニックを語っているだけではありません。
目標設定から、マインドセット＝心構え、仕事に対する考え方、生き方のようなところまで含ませて語ってくれてます。
そこから、「なるほど、そういう考え方ね」ということを踏まえて、具体的な学習の始め方を教えてくれているのが、この動画です。
プログラミング学習に挫折しそうになったら、見ていただきたい動画は、下記です。
そのタイトルも、「プログラミング学習は挫折する人ばかりなので、最高だと思う話【事実】」ということですが、けっこう深い話しをしてくれています。これからプログラミングを学んで、エンジニアを少しでも目指そう、と思った方は、必ず見て下さい。
さて、このマナブさんの動画を見て最低限、確認しておきたいことを、まとめておきたいと思います。
１．プログラミングにはいろいろな言語があるけど、とにかくHTMLとCSSからスタートする、ということ
２．学習する方法は、オンラインで動画を見る、ということ
３．プログラミングは暗記する必要はなく、必要な知識は検索して調べながら、とにかく目的＝たとえば「ホームページを作る」を達成するため、基礎知識をざっと確認すべきだ、ということ
ステップ２．プロゲートで学習を開始する
HTMLとCSSは、基本的に動画を見て学習していくことがわかりました。
学習するプラットホームは、無料で利用できる progate（プロゲート）です。
https://prog-8.com/users/sign_in
もちろん、プロゲート以外にも、ドットインストールや、youtube動画で学ぶこともできますが、とりあえず、プロゲートからスタートしてください。
プロゲートの特長は、「自分で開発環境を整備しなくても、すぐに学習を開始できる」という点です。
「開発環境とは？」
実際、HTML・CSSは、どのパソコンにも入っているメモ帳というツールさえあれば、学んでいくことができます。
しかし、作ったホームページのデザインを確認するために、Google Chrome（ブラウザ）にプラグインを入れたりして条件を整備していく必要があります。
でも、プロゲートなら、そういったことをすっとばして、ウェブ・ブラウザに直接、入力練習をしながら学習ができる、という点で、他の学習サイトよりも優れているんです。
さて、プロゲートを開始する前に、確実に見ておいていただきたい動画が、 Hiko Pro さんの
「Progate（プロゲート）の概要・効果的な学習法・どこまでスキルが身につくのか【プログラミング学習】」
という動画です。
学校の勉強と何が違うかというと、とにかく「学び方を学ぶ」ということです。学校のテストのように、知識や記憶を問うような試験はありません。わからなかったら検索をして、カンニングしてしまってOKです。 たとえば、リンクのコードがわからなかったら、「リンクを張るタグ」とか検索したら答えはすぐ出るし、カーソルを合わせたら画像を回転させるようにしたかったら、「画像を回転させる Javascript」とかで検索すれば、いくらでも答えは出てくるんです。
つまり、完璧主義にはなってはいけないんだな
さて、プロゲートを一通り学んだ後は、どうすればいいでしょうか。
同じHiko Proさんが優しいく解説してくれていますので、こちらの動画を見て下さい。
「Progateが終わったら次にするべき4STEP【HTML/CSS編】」
ステップ３．模写コーディング（をしてる動画を見る）
武者小路実篤 ？
なんて読むんですか？ というか、誰なんですか？
プロゲートが終わったら、模写コーディングというのを開始します。
模写コーディングとは、すでにインターネット上にアップされているサイトを、模写しながら、実際に自分だけの力でコーディングしてみる、という学習方法です。
そんなのできないよう、モモちゃん。教えてくれる人もいないし、答えがないのに、どうやって模写を完成させるのかのぉ？ チーズケーキ食べたいのぉ
だいじょうぶ！ ネットに公開されているすべてのホームページのHTML＆CSSは、すぐにそのソースを右クリックから確認することができるの！ 答え合わせが、自分でできるのよ！
模写コーディングは、プログラマーとしての実力をつけるための武者修行です。
正直、しんどいです。
ストイックな学び方であることは間違いありません。
でも、これができるようになったら、その時点で
あなたは、ゼロからサイトを自力で作れる、エンジニアになった！
と胸を張っていうことができるんです。
モモちゃん、だめだ、わしゃやっぱり模写なんてできない。集中力がないんじゃ。すぐにライフに夕飯の買い物に行ったり、シャケを取りに海に行ってしまうんじゃ。
じゃあ、模写をしている実況動画を見るだけでいいから！
模写コーディングのコツや、始め方についても、素敵な動画がたくさんあります。
一番はじめは、Webの神様 の動画、「【超入門】初心者向け 模写コーディング！オススメのやり方とポイント【HTML・CSS コーディング】」を見てください。
模写コーディングに必要なツールも、すべて丁寧に教えてくれます
上で、だいたい必要な準備が出来たら、次の動画を見てください。
これは、 0からWEBエンジニアChさんの、シリーズものになっています。
こういった実況動画をいくつか見て、完成まで「コーディングしている人がどうやってコーディングしているのか」ということを見てみてください。
とりあえず、見てたら、なんだかできる気がしてきます！
ステップ４：テンプレートを使用する
さて、以上まで進んだら、２つの方法を駆使して、実際にホームページを作ってみましょう。
もし、模写コーディングができるようになっていたら、デザインカンプ＝ウェブデザイナーから渡されるAdobe XDデータから、もう仕事を開始することができます。
つまり、この時点で、少額でもお金をもらいながら、エンジニアとして収入を得ることができはじめるんです！
模写コーディングが、不十分だったり、ゼロからがりがりコーディングするのが自分には不向きであると思った人は、テンプレート（後で説明します）を使用して、とりあえず、オリジナルのホームページを作ってみる、ということをしてみてください。
「誰のホームページを作ったらいいの？」
といった、質問が出てくるかもしれませんが、わかこくの制作事業部に連絡してもらえたら、課題制作をお出ししますので、お気軽に「お問合せ」から連絡下さいね。
モモちゃん、わしゃもう森に帰って、普通のクマらしい生活に戻りたいよ。
クマ先生、まだあきらめるのは早いですよ。ここでモヤモヤが残ってる人は、テンプレートを使ってホームページをとにかく作ってみてほしいの。
テンプレート？ わしも人生のテンプレートがほしいのぉ
テンプレートとは、ゼロからコーディングをしなくても、ある程度、フレームが制作されていて、画像や文字を入れ替えるだけで、かんたんにホームページができるような既存の枠組みです。
模写コーディングに挫折したり、とにかくホームページを制作する目標を達成するところから演習をしたい人は、次の動画を見てください。
まずは、テンプレートとは何か、ということをやさしく解説してくれている動画がこちら。
テンプレートの理解ができたら、ブートストラップ、というものが何かについて、次の動画で確認してください。
基本的なコーディングの知識があれば、次の動画が理解できるようになっているはずです。
まとめ
ここまでできれば、とにかくもホームページを作る、ということができ始めているはずです。
もちろん、いきなり完璧なプログラマー/エンジニアになることは難しいかもしれません。
しかし、ここまでできたら、確実にプロへの道を歩み始めれています。
この記事で何より伝えたかったことは、
必要なスキル・知識は、youtubeで得ることができる！！！
ということです。
行き詰ったら、どんどんyoutube検索で、動画を見て下さい！
＊わかこくメンバーは、わからないことや行き詰ったところを、 朝のポモドーロの時間にいつでも相談してもらえます。
がんばって！
あ、はい、がんばります……
NPO法人Wisa(ウィーサ)は、 若者が主体的に個性を活かした働き方のできる多様性のある社会の創造を目指して、リテラシー教育の開発と普及を行っています。
