ファイルに分ける

React入門 / 全 6 枚

1ファイルと複数ファイル

これまでは Card も Profile も App.jsx にまとめて書いてきました。部品が増えると、この1ファイルが読みにくくなります。

1ファイルにまとめて書く

// App.jsx
function Card({ title, children }) { ... }

function Profile({ name, title, bio }) { ... }

export default function App() { ... }

componentsフォルダへ分ける

src/
  App.jsx
  components/
    Card.jsx
    Profile.jsx

部品が3つを超えたあたりから、目当てのコードを探す手間が増えます。

1 / 6

← → キーでも送れます