I put a React component in its own file when:
✅It's reusable by itself
✅It's big, so it's helpful to be in its own file. Less scrolling. Easier to understand in isolation.

I put multiple components in a file when:
✅Not reused
✅Small
✅Parent-child relationship

#reactjs

I typically create a folder per feature/page. This allows me to place React components in separate files, but keep related files together.

So if nothing above applies, I default to one component per file, in a well-named folder that groups the related components.

View original on X