Emmetってどれくらい活用してる? 略して楽するハッピーコーディング！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

みなさん、お元気ですか？ 作業用BGMはどこかの島の雨音、フロントエンドエンジニアのザワです。 今回は、日頃より爆速コーディングを目指している小生が「Emmetを使った場合」と「使わない場合」でどのくらい時間短縮できるのか、興味本意で試してみた結果をご紹介します。 Emmetとは HTML、CSSをコーディングするときに、ショートカットキーを使用すると補完してくれるツールです。プロ、いわゆるロープーのコーダーであれば、使用しているという方がほとんどではないでしょうか。 ※今回の記事では、機能の詳細や導入・使用方法はスキップして検証に移りたいと思います。 検証前提 今回はwebサイトでよく見られるカードモジュールをコーディングしてみました。 HTML、CSSのコードはこちらになります。 <article class="card"> <a href="#" class="card__inner