購入価格:3125円
評価:
この記事は約2分57秒で読めます
CSSくらい出来るとたかをくくっていると、いつの間にか取り残されてしまうのがCSS。また、続々と新たな便利ツールも出てきており、学ばなければいつまでも古臭いスピード感のない作業を続けてしまいかねないのが恐ろしいところである。
本書の8割くらいは、既知の情報であったが、残りの2割が重要だと考える。Web業界は、とにもかくにも日夜アップデートが必要。
Sassで最も多く使用される機能の一つに@importがあります。Sassの@importは別のSassファイルを読み取り結合して1ファイルにまとめることができる機能です。以前からSassを使用していた方は馴染み深いのではないでしょうか。このSassの初期から実装されていた@importは2022年10月ごろにサポートが終了する予定で、代わりに@useと@forwardという新しいシステムが登場しました。Sassの@importは大変便利な機能でしたが、大きな問題として@importは、CSSの@importと重複しているため、SassなのかCSSなのか一見してわかりにくい側面があったり、実際にどのSassファイルで宣言されているかを把握するのがとても大変でした。また、読み込まれた全てがグローバルとして扱われるなどの問題がありました。
markuplint(https://markuplint.dev/)はHTMLなどマークアップをチェックするツールです。納品物のソースコードの品質を上げることは重要です。企業によっては一定の品質を保っている必要もあるためプロジェクトチーム内で品質のチェックをする必要があります。個別にコードをチェックするのは大変ですのでこういった場合はLintツールを使用するとよいです。markuplintが使用できる設定をされた環境ではこのようなmarkuplintrcというファイルをプロジェクトのディレクトリに置くことで内容を分析し、問題点を指摘してくれます。複数の人が関わるプロジェクトの場合に品質の向上につながりますので導入を検討すると良いでしょう。
Zeplin(https:/zeplin.io/)はデザインデータをチームで共有するためのツールなのですが、それだけではくコーディングに役立つ機能が沢山あります。使いこなすことで作業効率がかなり上がりますので紹介したいと思います。デザインのデータ形式はAdobeXD・Sketch・Figma・Photoshopに対応しており各ツールからデザインデータをインポートして使用することができます。インポートの手順や操作は方法は公式サイトから確認してみてください。