３月９日～３月15日 週報 初スキルマップシート確認 習熟度を上げる
3/10（火） スクール スキルマップシート確認 cssテスト続き
おおたさんと一緒に、スキルマップシートを見て、これまで学んできた内容の理解度を確認しました。
スキルマップシートを使うことで、自分がどこができていて、できていないのを可視化できて非常にわかりやすかった。
次回のスクールまでに、自分がまだ理解が足りない箇所は調べて、いままでやった個所の理解は定着できるようにしたいと思います。
わからなかったこと
HTML class名の付け方
それに対して調べたもののまとめ
BEMとは
以下WEBページ参照
BEMとは、「Block」「Element」「Modifier」の頭文字を取った略称で、CSS設計における統一された命名規則です。
class名を付けるうえで、多くのWEBデザインに使われています。
ーBlock
WEBページをヘッダーやナビゲーション、商品説明、フッターなどのそれぞれのパーツのことです。
ーElement
ElementはBlockの構成要素なので、BlockがなければElementを使用することはできない、言い換えればElementには必ずBlockが存在するということです。
ーModifier
Modifierとは、BlockまたはElementを修飾するために使います。
BEMの目的
この「BEM」が考えられた目的は、サイトやプロジェクトの成長に伴って既存のページが編集されていけるようにするためです。
そのためBEMには以下のようなメリットがあります。
1.長期間メンテナンスできる設計 →class名の命名規則が明確に決められていることからメンテナスを行いやすい。
2.チームのスケーラビリティ →BEMの理解があれば、メンバーの誰が見ても把握することができ、メンバーで開発していくことが容易になる。
3.コードの再利用性 →パーツを完全に独立させることができれば、コードの再利用が容易になる。
BEMの書き方
BEMは「Block__Element–Modifier」が命名規則の基本文型です。
BEMでは基本的にclassを使用し、idをなるべく使用しないことが決められています。
今後の改善行動
・Class名を指定するときは、BEMの命名規則に従って、自分だけではなく、ほかの人が見てもわかりやすいコードを書くこと意識する。
以前、スクールで提出して課題のときは、このBEMの考えを全く考えずにCLASS名をつけてしまっていたので、自分でもどこからどこまでの範囲を指定しているのが把握できなくなってしまっていたため。
4月から通うことになるスクールの方に参加。
インターン生が参加するスクールが終わった後に、一時間だけ通常のスクールにも参加させてもらいました。
講師の、たたのさん、みずもとさんと少しお話をすることができ、スクールの雰囲気や、実際に働き始めてからのスクールに対する取り組む姿勢などいろいろ相談することができました。
お二人ともとても気さくに話しかけてくださったので、初めて参加しても気兼ねなく相談したりできる環境で安心しました。
【３月目標達成進捗状況】
Wantedly募集記事作成 3/2記事作成 達成率 約70％
この記事が気に入ったらサポートをしてみませんか？