#前置き
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のコーディングでも使えますよー
##まとめ
新しいコンポーネントを作った時とかに、是非使ってみてください!
おすすめの拡張機能、コーディング方法あればコメントいただけると大変喜びます。