授業で使用する教材
教材はありません
「授業フィードバック」で、授業の感想を教えてください!
チュートリアルは、こちらの「その他のオプション」からいつでも確認いただけます。
ここには授業中のやりとりが表示されます
CSS設計方法論の1つである「BEM」について、徹底的に解説します!
(今回は全2回ある内の1回目の授業です)
BEMは数あるアプローチの中でも、何かと誤解が多かったり使いどころが難しい方法論です。
・SMACSSなど、他のルールと併用しようとしてカオスなことになってませんか…?
・命名ルール(Block__Element_modifier(key_value))を正確に理解していますか…?
・実際の開発でBEMを使うメリット、デメリットについて把握していますか…?
今回の授業ではこうした疑問を解消してまいります!
BEMの知識を身につけておくことで「長期にわたって破綻しないHTML,CSS」を書くことができます!
このスキルを使ってコーディングすることで…
・CSSを一箇所ちょっと修正したつもりが、意図しない部分にまで影響してしまった
・クラス名が思いつかなかったり、開発者間で付け方が違ったりしてカオスになる
・無駄な記述をしてしまい、CSSがどんどん膨れ上がってくる
などのトラブルを回避することが期待できます!
また、BEMをはじめとする設計を考慮したコーディングスキルは、現場で大変必要とされているスキルです。
今や設計ができないと、大規模で複雑なWebサイトやアプリケーションはコーディングできません!
・HTML,5 CSS3の基礎(必須)
・OOCSSなどのCSS設計についてのざっくりした知識(推奨)
+ ひな形のデータ「homework」(http://bit.ly/1hr20P9)内のファイルに沿って以下3つをBEMでマークアップし、zipにしてメールで送ってください
1. ナビゲーション
2. カード
3. ボタン
+ できるとこまででOKです
+ 送り先:kadai@schoo.jp
+ 件名:【課題提出】BEMを使った破綻しにくいHTML, CSSの書き方
+ 本文:とくになし(質問とかあれば書いて頂いても構いません)
+ 締切:9/4 23:59まで
スクー放送部
教室画面の機能をご紹介します
学習機能を活用して、効率よく学習しましょう!