[Web制作日記#10]CSS設計完全ガイドを6割ぐらい読んだ

日記を書き始めて10日目が経過しました！(個人的な体感は、30日ぐらいなんやが…笑)

そんな今日は

ベアさん

CSS設計完全ガイドを6割ほど読んだので、中間報告

をする記事にしますね。

また、日常ネタとして「時間とツールの見直しをした」って話もするつもりですよー！

興味がある人は、ぜひ最後まで読んでいただけると嬉しいです。

ベアさん

プログラマー / 起業家

Profile

プログラマー.site管理人

<どんな人か>
・エンジニア2年生
・メイン言語：Ruby on Rails
・Web制作の勉強中...

実はまだ10代です！
最近はWeb制作で稼げるように奮闘してます。

プロフィールを読む

X

CSS設計完全ガイドを6割ほど読んだ

↑の本を6割ほど読み終えました。

中間発表的な感じで、

の2つを書きます。

結論から言うと、「普通に難しいけど、網羅性や実例があって丁寧」な本ってのが途中までの感想で、割と評価高め？です。

それでは、レビューからいきましょう↓

(忖度なしの)正直レビュー

お堅い、普通に難しい笑

まず、本を開いて、パラパラめくって思ったのが

ベアさん

あ〜こいつは難しいやつやな〜笑

そして、実際に本を読んでみると案の定難しくて、横文字も結構並んでます。(一度置いてかれると、大変です…)

どの辺が難しいかというと

などが挙げれます。

とはいえ、難しいのはデメリットだけじゃなくて、良い面もあると思います。以下では、どっちかと言えば良い点を書きますね↓

網羅性とかは星５

まず、何よりも

です。さすが、「完全ガイド」とタイトルにつけるぐらいですね。

ベアさん

また、網羅性があるので辞書的な使い方をしても良いなと…

僕、一応エンジニアとして実務も積んでるのでわかるのですが、網羅系の本は「大事な部分を抜き取る力」が必要と思ってます。

なぜなら、網羅系と言いつつ

ような本が多く、この本もそんな印象を受けましたね。

この本につられて僕もお堅いことを言ってますが笑、大切なことかな〜と思って共有してみました！

実例付きでわかりやすい

この本、割と実例の部分が多くて

ような構成の本でした。

僕、最初の理論が全然わからないまま進んでいたのですが、さすがに実例ばっかり見ていたらなんとなくわかってきました。

そして、ちゃんと理論の部分を読み返したら…

ベアさん

え？スイスイわかるんですけど？

って感じになりました。

また、BEMという技術がこの本のミソだと思ったので、忘れないうちにちょいアウトプットしておきます↓

ちょいアウトプットしてみる

CSS設計の手法の一つにBEM(ベム)というのがありまして、個人的に好きなのとよく使われてるみたいなのでアウトプットします。

BEMを構成する要素の全体像は

という3+1で構成されています。

悩む人

なんか、よくわからん英語が並んでるぞ

と思った人、完全に本を読み始めた頃の僕と同じです笑

それぞれを簡単に解説すると

って感じで、文字じゃ難しいのですが割とシンプルですよ。

また、BEMには命名規則があります↓

ベアさん

・BlockとElementの間に_が２つ
・ElementとModifierの間に_が１つ
・名前の間には-が１つ

って感じになるよ！

MindBEMbingという命名規則なら、「ElementとModifierの間に–が2つ(＋キーを省略)」っていうのがあるみたいです。

プロジェクトに応じて使い分けしながら、BEMを使いこなしていきたいですね！

時間・ツールの見直しをしたよ

日常ネタなのですが「時間・ツールの見直し」を時間をとってやりました。

時間の見直し

僕いっつも

ベアさん

時間がない…時間がない

と言ってる割に、無駄な時間が結構多かったので。

具体的にやったことは

っていう、シンプルなやり方をしました。

その結果として

などを行ったのですが、Youtube見るのをやめるのが８〜９割で効果抜群です。

自分の意思で使ってない時間はお金もそうですが、削除するのがおすすめです。(精神的にも穏やかな日常になりました)

ツールの見直し

使用しているツールをうまく使えてない感じがあったので、時間のついでにツールも見直すことにしました。

主に見直したのが「タスク・スケジュール管理」で、最終的に

という感じにしました。

これでうまくタスクを管理できると良いのですが…比較的忙しくない今から頑張ってやっていきます。

ツールの見直しは以上です！皆さんも参考にしてくださいね・

次回：Youtube見るのやめた効果がえぐい！

次回は「Youtube見るのやめたら…良い効果があった」をテーマに記事を書きます。今日の記事で、時間を見直したので。

仕事の生産性が上がるし、脳がすっきりするし…良いことしかないです。

お楽しみに！

P.S

11話書いたよ↓

あわせて読みたい

[Web制作日記#11]Youtube見るのやめた効果がえぐい！

Web制作日記のアーカイブはこちら↓

あわせて読みたい

Web制作日記のアーカイブ【随時更新】

ベアさん

プログラマー / 起業家

X

プログラマー.site管理人

<どんな人か>
・エンジニア2年生
・メイン言語：Ruby on Rails
・Web制作の勉強中...

実はまだ10代です！
最近はWeb制作で稼げるように奮闘してます。