フロント実装

 おうち時間がそろそろ明けるかな…。

そんな雰囲気を感じています。私は、この3週間、こもりきりでプログラミングを勉強していますが、通っているスクールも教室解禁が近い雰囲気です。

 

 この週末は、「フロントの実装」を行いました。

とあるアプリのフロント画面を作成する課題です。

Hamlとsassを利用の上、フロントが作られていく過程は難しいですが楽しかった。

 

初見でこの工程を行うとなったとき、「なんだこれ!」と思いました。

まず、どこから手をつけるべきかがわからないのです。

しかも、Hamlのベース?と言っていいのでしょうか、フロントの基本であるHTML

CSSは基礎の段階で学びましたが、その際はCSSのみ編集することが多く、HTMLを編集する機会はなかったのです。

 

そんな中でのスタートですから、本当に頭の中ははてなで埋め尽くされました。

ですが、スクールにはわからないところを教えてくれるメンターさんがいます。

ある程度自力で調べたり、VSコードをいじってわからなくなったら、メンターさんに訊きまくりました。

 

メンターさんとの会話の中で、絡まった鎖が解けるように、Hamlの書き方がわかってくるのです。コツがわかりさえすれば、もう半分くらいはこっちのものでした。

 

このフロント実装作業というものにはミソがあります。

クラスを親子関係で捉え、定義したクラスの下にそのクラスに必要な要素を組み込みます。

わかりやすくいうと、まず1枚の大きな紙があり、その上に今度は必要に応じて紙を重ねていく、と言った感じです。

もしくは、箱の中にさらに小さい箱が入る感じ。

私は、自分なりに解釈するため、マトリョーシカみたいだ!とも考えました。

 

ともあれ、このフロントの構造や関係性が見えてくれば、あとは記述ルールに従うだけです。

あれやこれや自由にデザインできるので、その分プロパティの数は無数にあり、ぐちゃぐちゃになることもありますが、少しずつ、パズルのように作業を積み上げることでフロント実装が叶います。

 

私は駆け出しエンジニア!ともまだ言えないひよっこです。

習いたてのことをこうして書くのは私にとっては思考の整理になりますが、読んでくださる方には「こいつ何が言いたいの?」と言った文章だろうなと。

 

いずれ、もっと学びを深くして、今日のブログを振り返った時、内容をアップデートできるよう進んでいきます。

 

読んでいただけた方(いるかな…笑)。

 

本当にありがとうございます。