【衝撃の事実】コーディングは楽しいだけじゃなかった…

人にもコードにも、適材適所があるんだね。

前回に引き続き、 Progateを利用してHTMSとCSSのコーディング練習を行いました。

今回は、手取り足取り“どこに何を入れる”を教えてもらいながら書いたサイトと、全く同じものを指示なしで自分で作ってみるという、道場コース。

コーディング楽しいいいい！と上がり切っていたテンションはどこへやら、パッと白紙(背景は黒)のエディタが表示された瞬間、「ごめんなさい、わかりません」と完全白旗状態。

何から手をつければ良いのか、どんな構成になっていたのか、わからない。指示されるがままに書いていたコードたちは、わたしの頭の中から出ていってしまっていた。

1回でマスターできるほど記憶力のよい人間じゃないと思ってはいたものの、ここまでかと。

先の見えない完成までの道のりを前に大きく深呼吸をしたわたしは、まず構図を改めて整理することにした。

ノートを広げ、かたまりごとの要素を書き出す。

今回は、ヘッダー、トップ、レッスン、メッセージ、フッターの5つの塊に分かれていた。

ヘッダーの中に、画像とログインボタン、トップには見出しと文章… となるべく詳しくサイトを分解して構図を理解した。

この作業、めちゃくちゃ大事なんですね。

何から手をつければいいか、それはまず構図を整理すること。きっと模写をするときにもとても重要になってくる気がする…

ところどころお手本ソースをのぞき見ながらやっと完成。先日とは打って変わって、心地よい疲労感と達成感に包まれた。

課題に感じたことは大きく２つ。

① 適したコードがわからない

コードはたくさん種類がある、そして英語… 「字を真ん中に持ってきたい」と思っても、なんて書けばいいんだっけ… といちいちつまずく。数をこなすしかないと思うがスラスラ書けるようになりたいなぁ。

② どの要素に指定すればいいかわからない

「ここの間に空間を開けたい」、「この塊を右に寄せたい」と思ったとき、大抵2〜3択に迫られる。で、大抵はずす。コードの性質の理解が進めば困らないことが増えるのかな。

あとは、marginとpadding とか、text-alignとwidth:auto とか、なんか働きが似ててややこしい子たちを使いこなしたい。

人によって書き方の好みとかもあるみたいで、やっていくうちに書きやすい方法が見つかればいいなーと思っている。

楽しいだけじゃない。簡単すぎない。

道場コースを通じて、わたしはもっとコーディングが好きになってきた。