プログラミングをイチから学びます!HTML CSS編

プログラミング HTML CSS Progate Proゲート プログラミング

なぜ今からプログラミングを学ぶのか

 

パソコン関係の仕事についていない方でもこれからプログラミングを学ぼうと考える方は多いと思います。

私もその一人です。

 

なぜプログラミングを学ぶか、

  • ホリエモン、マナブログのマナブさんが今こそプログラミングを学んで稼げと言うから
  • ブログサイトをいくつか運営していますが、全てワードプレスで作ってます。プログラミングの知識がないので微調整ができない
  • プログラミングを学んでクラウドソーシングサイトから仕事を受注して副業として稼ぎたい
  • 知人のホームページの制作もやりたいけど、ワードプレスでしか作れないので自信がない
  • プログラミングを勉強して子どもたちにも教えられるようになりたい

などです。

 

 

まず手始めにHTML&CSSから学ぶ

無料で勉強できるサイトやアプリがたくさんあります。

その中でも有名な「Progate」のアプリから始めます。

口コミによるとProgateのサイトで勉強するより難易度が低いと書いていたので。

それとアプリだと仕事の合間にIPadProでサクサク学ぶことができると思ったからです。

 

 

HTML&CSSを2周した

プログラミング HTML CSS Progate Proゲート

HTML&CSS以外にもさまざまな言語を学ぶことができます。

無料会員でも基本的な17レッスンを受けることができます。

980円/月(税別)の有料会員になれば76レッスン受けることができます。

まずは無料会員でやってみて全体をさらっと学んでから有料会員になるかは考えようと思います。

 

 

 

プログラミング HTML CSS Progate Proゲート

IPadProのアプリでプログラミングを学ぶのってどうなのかな?と半信半疑でしたが、やってみると難しくて勉強になります。

タグや記号を選択するだけなので操作は簡単です。

 

 

プログラミング HTML CSS Progate Proゲート

絵も優しいタッチなので頭がこんがらがる気持ちも和らぎます。

1周では全然理解できなかったので、復習兼ねて2周しました。

 

 

マナブ氏が「手を動かせ」と言うのでパソコンで実際にコードを打ってみた

プログラミング HTML CSS Progate Proゲート

HTML

 

プログラミング HTML CSS Progate Proゲート

CSS

 

IPadProのProgateアプリの例題の画面を見ながらSublime Textを使ってひたすら打ち込んでみました。

打ち込んでみてよくわかりました。

全然理解できていなかった。。。と

実際に手を動かして初めてインプットされます。アウトプットすることの大事さ!

 

 

プログラミング HTML CSS Progate Proゲート

そしてChromeで開いてみてビックリ!

HTMLとCSSとはこーゆー働きをしているのか!と実感しました。

HTML&CSSを通り越してワードプレスでサクッと作ってしまっていたので根本を理解していませんでした。

自分の手でコードを打ち込んでWebサイトぽいのが表示されたことに感動しました!

 

 

 

プログラミング HTML CSS Progate Proゲート

 

お手本とは若干ずれていますが十分でしょう!

完璧を求めていては先に進めません。

 

 

まとめ

とりあえずHTML&CSSを学んでうっすらWebサイトの構造がわかりました。

わからなくても立ち止まらずに答えをみながら進んで、もう一周復習しながら進めて行きたいと思います!

 

コメント

タイトルとURLをコピーしました