こんにちは、穏やか暮らし計画ライターのあらです。
前回PHPだけで、おみくじツールを作ってみましたが、機能的なことしかできず随分質素なツールになってしまいました。「ここにボタンを配置したい!文字をもう少し大きくしたい!色をつけたい!」となると、PHPだけでは不可能だということが分かりました。
ですから、今回はサイトの枠組みとして使えるHTML(Hyper Text Markup Language)を勉強していきたいと思います。プログラミングのことをちょっとでも調べた方なら、絶対に名前だけなら聞いたことあると言っても過言ではないくらい有名なプログラミング言語です。
では早速どのように勉強したのか紹介していきます!
TechAcademyのはじめてのHTML入門講座
HTMLの初心者向け勉強方法で調べると、YouTubeで配信されているTechAcademy【テックアカデミー】さんの『はじめてのHTML入門講座』というもので勉強されている方が多くいましたので、私もそれで勉強してみることにしました。
もちろん無料で、4分〜7分の動画が24本。計約120分で全て見ることができます。全部視聴してから、合計時間を計算しましたが意外と長いですね笑
しかし、YouTubeの機能では倍速機能がありますので、前半や簡単なところは1.5倍速で聞いていました。後半になるにつれて、コードが長くなってきて理解するのに少々時間がかかる部分もあったので、等倍で視聴しました。
ただ視聴して分かったつもりはNG
「見るだけじゃだめ。自分でコードを書いて学びなさい」とプログラミング講座を色々見ましたが、全員が同じことを言っていました。実際、動画を見ながらコードを書き、それを実行しても見本と違う実行結果が出てくるのは稀なことではありません。
スペルミスやコードの配置が違かったり、間違えることはたくさんあります。ですから、どこが間違っているのかを探す作業もプログラミングだということはPHPやHTMLを勉強する上で痛感させられました。
もちろん、コードを書いただけで完璧に覚えることも天才じゃない限り不可能です、しかし、上記のように自分が書いたことを残すことによって、「ここはこんなことをやったな」と忘れても思い出すきっかけになると思います。
これだけやったと自信にもなるので、やっぱりめんどくさくても「視聴だけ」というのはすごくもったいないことです。
- 動画をみる
- コードを書く
- 実行結果を確認
- できていれば、次の動画。見本と違う場合はコードを修正
というサイクルで24本の動画を視聴するので、おそらく4、5時間はかかったのかなと思います。
ですが、24本動画全て簡潔に短い時間で、しかも分かりやすく解説してくれているので、無料の教材とは思えないクオリティだと思います。
実際に書いたコード
最終的にこのような入力フォームを作ることができます。どれもネットで登録する時に見たことがあるフォームなので、自分でも作れるようになるなんてちょっと感動しています、
この基礎を元に、自分が作りたいようにコードを書いて、枠組みをすることが可能になりました。
まとめ
これでHTMLの基本中の基本を学ぶことができました。まだ入門編なので、HTMLの全てが分かっただけではありませんが、掲示板を作る上で、分からないことがあれば調べて理解できるまでにはいけたのかなと思っています。
他のサイトのソースコードはHTMLなので、それを見るのも少し楽しみになっています。
次回からは、
- CSS
- 掲示板のためのコードの理解
- CSS・HTML・PHPを組み合わせる
- 組み合わせたコードをサーバーにアップロード
の4つが掲示板を作る上で課題になってくると思います。
PHPの勉強したおかげなのか、HTMLの入門編はPHP入門よりとても簡単だった印象で勉強中もとても楽しかったです。作ったコードがすぐ形になり、今まで自分が使用してたサイトがこんな風に作られているのが分かるからかもしれません。
CSSもこれだけ面白かったらいいなと思っています笑
最後までご愛読ありがとうございました。