
元ニート、あてもなくコーディングを学ぶ #1 【HTML/CSS】
ついに!気になっていたコーディングを!学びはじめます!
ほんとに、何も知らない状態からのスタートです。
このマガジンは、Web制作のことを何も知らないわたしが、Webコーダーになる(かもしれない)までの記録です。
動画を見てイメージをつかむ
ほーんとに何も知らないので、まずはYouTubeを見ました!
ヒロコードさんのこちらの動画シリーズは、デザインからコーディングまでの流れを、説明とともにノーカットで見せてくださっています。
Webデザインとコーディングの「違い」と「繋がり」を、イメージとして捉えることができました。
やっぱりデザインは苦手そうだけど、コーディングは楽しそう!
Adobe入手 & デジハリ受講
コーディングへの興味が深まったところで、本格的な学習に入っていきます。
コーディングを学ぶだけなら、無料のソフトだけで足りるようですが、デザインもまとめて学びたいので、Adobeに課金しました。
貯蓄のない元ニートには高い…!でも「学びたい欲」には勝てません。

デジハリのAdobeマスター講座もついてきたので、さっそく受講します。
正確には、デジハリの講座にAdobeが付属している形だけど、感覚としては最安でAdobeを入手したらデジハリ講座もついてくる!ですよね。ね?
最初に受けるのはこちら。ついに、HTMLとご対面です。

この他にあと3つあるようです
AdobeのDreamweaverは、便利だけど動作が重いらしく、コーディングに使うソフトとしては主流ではないらしい…。
でも、とりあえずHTMLを学びたいから気にせずやります!!
以下、DreamweaverをDwと表記します。
ブラウザですぐ見れることに驚き
講座の動画を見ながら、実際にDwを動かします。
Dwでコードをいじると、Dw内のウィンドウに結果が表示される。
まあ、ここはプログラミングを学んだときと同じだな。
次は、ブラウザソフトのChromeで、作ったファイルを開いてください?
え!?Chromeにも表示されてる!!
真っ白な画面にちょっとだけ文字が出てる!!

プログラミングを学んだときは、開発ソフト内でしか、結果を見ることができませんでした。
いろいろプログラムを書いてるけど、結局何になるんだろう…?という感覚のまま講座が終わり、そのまま学習もやめてしまいました。
でも今回は、ほんのちょっといじっただけで、別のアプリで表示させられる!
この手応えに感動しました。
よくよく考えたら、PDFや画像を開いたりするのと同じことだろうけど、楽しいもんは楽しいです。
よし、今日のアウトプットはここまで。
最後までお読みいただき、ありがとうございました。