Container / Presentational構成【Reactのコンポーネント設計】 | NOCHITOKU

こんにちは！フリーランスエンジニアの雄貴です！ Reactを用いたコンポーネント設計の方針は様々ありますが、 私が普段用いている手法を紹介しようと思います！ Reactのコンポーネント従来のコンポーネントだと、以下のコードのように関数の中でstate(状態)やfunction(ロジック)を定義し、それを「return」直下のview部分に渡してレンダリングしています。 import React from 'react' /** * InputForm * @returns */ export const InputForm: React.FC = () => { // state (状態) const [value, setValue] = React.useState('') // function (ロジック) const handleChange = (event: React.Ch

[nilab]

Container / Presentational構成【Reactのコンポーネント設計】 | NOCHITOKU

[shingo-sasaki-0529]

“部分的に採用することで保守性は上がりますので、設計段階で検討して取り入れていくのがベストだと考えています。”