Emmetを使ってコーディング作業を爆速化しよう!WordPressもだよ!!

どうもどうも!五体満足じゃねぇクリエイティブディレクターぐっさんでございます。サマー突入で毎日暑いですね。今年は血流を良くする漢方薬を飲んでるためか、いつもよりカラダが火照ってますよwww

さて本題です。みなさんはタイピングスピードに自信ありますか?
残念ながらボクはタイピングスピードは遅いです。元々遅かったのですが、くも膜下出血を患ってから右半身の細かい動きがビミョーで更にタイピングスピードが劇的に遅くなりました!
しかしながら、コーティングのスピードはそこそこです。それはなぜか?
タイトルにもありますかEmmetという拡張機能を使っているからです。
Emmet — the essential toolkit for web-developers https://emmet.io/
だいぶ浸透しているのでご存知の人が多いかもですが。
Emmetは前はzen-coadingと言われてましたが、htmlとcssの記述を短縮化出来る奴です。これを使う事によって…
・タイプミスが少なくなる
・タイピングが少なくなるので腕が疲れない
と便利グッズ!コーダーさんはほぼほぼ必須アイテムだと思います。
これを使う事によってタイピングスピードは遅くてもコーティングのスピードは遅くならない…いや慣れたら劇的に上がるかも?というものです。
百聞は一見にしかず。1例をば。
例えばリストタグを<li>を5個作ってその一個一個のliにaタグ(リンク)をつける場合….当たり前にコードを書くとこうなりますよね。
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
それがEmmetだったら。こうゆう風になります。いわゆる短縮記法ですかね
ul>(li>a)*5
そう書いてTabキー(もしくはCtl+E。このへんは使ってるエディタで変わってきますし。設定で変えれます!)で展開。そうすると前述で書いたようになります
少し書き方(法則?)を覚えなくてはいけませんが、そんなに難しくありませんし今後の爆速コーディング作業のためなら覚える時間を惜しんでは行けないっす(๑•̀ㅂ•́)و✧
ちなみにボクはhtml記述で使ってますが、cssも爆速でかけるんです。リハビリ中にcssの方は練習して覚えようかなと
【Emmetの使い方を詳しく紹介してる参考ブログ】もいくつか紹介しておきます
・Emmetってどれくらい活用してる? 略して楽するハッピーコーディング! | 東京上野のWeb制作会社LIG →https://liginc.co.jp/member/member_detail?user=okazawa_shinya
・Emmetを始めるのに、とりあえずこれだけ覚えておけば大丈夫 | WEB EGG → https://blog.leko.jp/post/introduction-of-emmet/
で、最近知ったのですが、ボクが使ってるWordPressもプラグインでEmmetが使える!
WP Emmet – WordPressのテキストエディタでEmmetが使える! | ザ・サイベース → https://thesaibase.com/wordpress/wp-emmet
えーっ(・_・;)
これならわざわざエディタで記述したものをコピペする必要なくWordPressのエディタ上で記事が書ける!
コードを直接書いて、記事を書いたほうが、キレイなコンテンツになるんですよね。(デモ最近導入された新エディタ「Gutenberg」を使ってる。なんかよさげ)
WordPress任せだと(ビジュアルエディタで書くと)ビミョーなコードで仕上がりがうーん(・ัω・ั)て感じになる。
それがEmmetのプラグインを入れてしまえば、サクサクっとテキストエディタでコードを書き書きして記事が書けるってもんです。
けど注意点が。
ボクが使ってた感想ですがフォームプラグインの『MW WP Form』を使ってるのですがフォームを作る時に上手くフォームが作れなかったです。
フォームパーツを選択してInsertさせても普通ならコードが表示されるはず何やけど、何故か表示されなかった。
で、Emmetプラグインを止めてフォームを改めて作ったら問題なかった。
プラグインの相性悪かったかな?
と、言う訳でその辺気をつけて下さい。でもEmmetは超オススメです。
覚えてみんなで爆速コーティングライフをしましょう
こんな記事もあります。
-
前の記事
GoogleHomeminiを1ヶ月近く使ってみて 2019.08.05
-
次の記事
視覚障害者のパソコン操作のサポートをして感じた事を書きます。その1 2019.08.29
コメントを残す