前置き
Reactコーディングをする時に、便利だなと感じる機能、ツールをまとめました。
コーディングスピードを爆速でぶち上げたい方向けです。（言いたいだけ）
仕様ツール
- Visula Stadio Code
- Simple React Snippets(拡張機能)
①VS Codeのショートカット
Reactのファイルを開いたら...
-
command＋Kを押してからM
これめちゃ便利です。Reactのファイルは、デフォルトだとJavaScriptのファイルと認識されてしまいますので、Reactで使いたいSnippetsやEmmetが使えなかったりします。
②Simple React Snippets(拡張機能）
| Snippet | Renders |
|---|---|
| imr | Import React |
| cc | Class Component |
| ccc | Class Component with Constructor |
クラスコンポーネントなんて、打つと長過ぎるので100億秒くらい節約できます。
タブストップもいい感じに設定されているので、上手に使いこなしましょう。
③VS CodeのEmmet
JSXを記述する時
.container → <div className="container"></div>
classNameって長すぎやねん...
HTMLのコーディングでも使えますよー
まとめ
新しいコンポーネントを作った時とかに、是非使ってみてください！
おすすめの拡張機能、コーディング方法あればコメントいただけると大変喜びます。