Chapter 8 · Practice 3 of 4
Group files by feature, not by file type
From Project hygiene
Why it matters
A components/, hooks/, utils/ split works for tiny apps but scatters one feature across many folders as the app grows.
Group related components, hooks, tests and styles by feature or route, such as features/cart/, so you can find, change or delete a feature in one place.
- Keep truly shared pieces like buttons and form fields in a separate shared folder.
- Put tests next to the code they test so they move with it.
- Set up a path alias instead of deep relative imports like
../../../../utils.
Do
- Keep a component, its test and its styles in the same folder
Avoid
- Deep relative imports like
../../../../utils; set up a path alias