Webプログラミングに興味がある方に、読んでほしい記事です。
私はウェブ業界で働いていながらも、営業職ということで、プログラミングとは無縁だったのですが、いつも心のどこかで、
「アイデアをかたちにできるプログラミングやってみたいなー。」
「でも、もう遅いかなー。」
「予備校通ってみようかなー。」
と思っていました。
そんなときに、今回紹介する「オンライン学習サイト」に出会い、Webプログラミングの基礎については一通り勉強することができたので、実際に勉強した「オンライン学習サイト」や「勉強したプログラミング言語」について紹介できればと思います。
スポンサーリンク
なぜオンライン学習を選んだか
プログラミングを勉強するにあたって、まず頭にあったのが、「参考書やウェブサイトの情報もとに独学でやる」という選択肢でした。
「お金も最小限で済むし、自分のペースで進められる！」そう思い、さっそく行動に移しました。
本屋に行っても、サイトを見ても、全然頭に入ってこない・・
見出しどおりですが、情報が多すぎで、まったくわかりませんでした。
何から手をつけていいのかわからず、、「開いては閉じる」という動作を何時間もやっていました。
このままだと時間だけが過ぎていく・・・と思い、一旦この方法は置いて、お金で解決できる「予備校に通う」という選択を考えてみました。
は、半年で50万！・・・払えないっす
知人も通っていた某予備校の無料相談会に参加したのですが、
私「プログラミングを学んで、ウェブサイトを作れるようになりたいんです。」
某予備校「そうですか。こちらが見積もりです。」
私「は、半年で・・・ご、50万ですか・・・。」
結局、やめました。
10万円なら払えたかもしれませんが、50万円は無理でした。
「もっと予備校が安かったらいいのに・・・。」
そう考えながら「ホリエモンドットコム」を見ていると、「ホリエモンおすすめオンラインプログラミング講座」（おそらく広告）という記事があり、これが「オンライン学習」との出会いでした。
ホリエモンおすすめオンラインプログラミング講座
この記事には、
「世界で3万人が受講！未経験からWebプログラマーになるための全て」
「テーマごとにそれぞれ10分程度の短い動画」
「見ながら試しながら学べるHow to動画」
と書いてあり、まず目的にマッチしていると思いました。
問題の費用ですが、通常「19,800円」のところが、キャンペーン期間で80%オフの「3,980円」になっており、「これしかない！」と思い、受講を決めました。
これが「オンライン学習」を選んだ理由でした。
オンライン学習サイトと勉強法
記事で出会ったオンライン学習ですが、「ShareWis ACT」という学習サイトにある「世界で3万人が受講！未経験からWebプログラマーになるための全て」という講座になります。
プログラミング言語ごとに、5分〜10分の講座にわかれている。
このイケメンのお兄さんが動画で優しく教えてくれる。
（2016年5月追記：現在はお兄さんではなく、女性になっていましたw）
どうやって勉強したか
動画見て、実際に手を動かしながら勉強しました。
動画には、講師のデスクトップが映り、同じ動きをしていけば、「このプログラミング何？→なるほど、こういうことか！」という具合に、プログラミングを覚えていくことができます。
わからないことがあれば、動画を見返したり、講師にメールで質問したりできるので、途中で挫折せずに、進めていけました。
補足学習で使った別のオンライン学習サイト
勉強を進めていく過程で、「ドットインストール」というオンライン学習サイトにも出会い、補足学習として使いました。
「ドットインストール」は無料のオンライン学習サイトで、プログラミング学習では、こちらのほうが有名のようです。
「ACT」同様に、レッスンが選べる。
個人的な感覚では、「ACT」のほうが初心者向けで細かいレッスンだったので、学習した言語についてさらに理解を深めたいときに、「ドットインストール」で復習をしていました。
勉強したプログラミング言語
「ACT」の講座に従って、「HTML」「CSS」「JavaScript」「PHP」まで勉強したので、少し詳しく言語の説明を書いていきます。 （「HTML」「CSS」について厳密にはプログラミング言語ではないのですが、広義の意味で入れています。）
HTML
「HTML」は、ウェブページの「骨組み」のようなもので、すべてのウェブページはこの「HTML」という言語の中で作られています。
「HTML」を使うことによって、下記のようなことが可能になります。
・ウェブページを作る骨組みができる。（もはやルールみたいなもの）
・改行、書式変更、リンクの挿入など文章が書ける。
・画像の挿入ができる。
最も基本的な言語だからこそ、知っておいたほうが良い言語になります。
CSS
「CSS」は、ウェブページの「洋服」のようなもので、ウェブページを視認的に見やすく、効果的にデザインする言語になります。
「CSS」を使うことによって、下記のようなことが可能になります。
・ウェブページ全体、もしくは、一部の色を変える。
・ウェブページ全体、もしくは、一部の文字書式を変える。
・ウェブページ全体、もしくは、一部のレイアウトを変える。
「さっき説明した” HTML” でも色や書式を変えられるじゃん？」って思うかもしれませんが、「HTML」だとチマチマやらなければならないのに対して、「CSS」を使えばサクッと変えられるイメージです。
サイトをデザインする →「CSS」と覚えました。
JavaScript
「JavaScript」は、ウェブページを動的に変化させるために使われる言語です。
ウェブページ上で何か動いたり、変化したりするものがあれば、「JavaScript」が埋め込まれている可能性があります。
ページを更新しなくても処理ができるのが、「JavaScript」の特徴でもあります。
「JavaScript」を使うことによって、下記のようなことが可能になります。
・「◯◯な条件で、◯◯をする」というが処理ができる。
（例）
文字上にマウスオンすると、文字の色が変わる。
フォームに正しい文字を入力すると、アラートが表示する。
ボタンをクリックすると、文字が表示される。
条件とアクションの作り方さえ覚えてしまえば、いろいろな表現ができる言語だと思います。
（作り方が慣れるまで、結構難しかった・・・。）
PHP
「PHP」は、ユーザーの行動に対して、サーバー上で処理した結果を返したり、データベースに保存や書き換えをおこなったりできる言語です。
よりユーザーとインタラクティブなページを作成することができます。
「PHP」を使うことによって、下記のようなことが可能になります。
・ユーザーがフォームに入力した情報を表示させる。
・ユーザーがフォームに入力した情報をデーターベースに保存、更新する。
・データーベースから情報を出す、利用する。
「JavaScript」を勉強した後だと、同じような作り方をしたりするので、結構進めやすいです。
「PHP」までやると、サイトの構成がどのようにできているのか、なんとなく理解できました。
勉強した成果を発表
Webプログラミング関連の文書や会話がわかるようになった
仕事で「エンジニア」「デザインナー」職種の人と話すときに、プログラミング言語のフレーズが出てきても、前よりは自然と会話ができるようになった気がします。
（たまに、知ったがぶって、うざいと思われている気もします^^）
「これは、CSSの書き換えでいいから、大きな開発はいらないなー。」とか言えるようになります。（うざいですね^^）
物事の整理がしやすくなった
プログラミングって、いかに「効率的で綺麗にソースコードを書いていくか」という点を求めているので、すごく考え方の参考になりました。
プログラミングのソースコードのように、議事録を書いたら結構わかりやすかったり、条件とアクションをプログラミングっぽく考えてみたり（うまく伝えにくいですが・・・)、効率的な考え方が身についた気がします。
学習した内容の90%は忘れた
「じゃあ、何かサイトを作ってよ」と言われると、オンライン学習を1〜2回したくらいでは、ほぼ100%無理です。
やってみて思ったのは、英単語と同じようにすぐに忘れてしまうので、結局自分でサイトを作ってみたり、仕事で関わったり、必要に迫られて何度も経験しないと覚えられないと思いました。
ただ、Webプログラミングの考え方や言語自体は学べるので、決して無駄ではなかったと思っています。
本記事は以上になります。
記事内で紹介した「ACT」の講座については、たまにキャンペーンで安くなるので、そのときに購入するのをオススメします。
（2016年5月追記：現在はキャンペーンに関係なく、5,980円のようです。）
もし、「お金を払うのは無理！」という方は、「ドットインストール」であれば無料で入門講座が受講できますので、こちらで学習するのをオススメします。
私の場合、実はPHPの勉強途中で、簡単にウェブサイトを作ることができる「WordPress」に出会い、Webプログラミングの勉強を中断してしまいました。
もし、Webプログラミングの勉強よりも、「とにかくウェブサイトを作りたい！」という方は、「WordPress」の使い方を覚えたほうが近道かもしれません。
【参考】もう悩まない！簡単にホームページを作成する 5ステップ
お付き合い頂き、ありがとうございました！