Reactのコンポーネント化

こんばんはaokiです。

引き続き案件に取り組んでいます。

その過程でコードが長くなりがちになることが多発したため、改善策をご紹介します。

共通パーツのコンポーネント

各ページで表示されている共通のパーツ・・・
・ヘッダー
・サイドバー
・ボタン
・フッター

などが挙げられます。

実装方法

① 共通パーツ専用のjsxファイルを作成する

② 作成したファイルに共通パーツのコードのみを記述する

③ 読み込ませたいファイルに移動し、< jsxファイルで定義した関数名 />を記述

たったこれだけで時間短縮だけでなく、コーディング量の減少やエラー防止につながります。

みなさんも頻繁に使うパーツがあったらぜひ試してみてください。

一週間お疲れ様でした。