08-recipes/02-add-a-component.md

Add a component

Use this recipe when a new reusable UI unit is needed.

A component is the right choice when the logic is mostly presentation, props, and local UI state.

Steps

1. Check whether an existing component can be reused or extended. 2. Create a new component only if the UI responsibility is genuinely new. 3. Keep the component focused on presentation and local behavior. 4. Pass data and callbacks through props. 5. Avoid store ownership unless there is a strong reason.

Where it should live

If the component is feature-specific:

features/featureName/components/

If it is truly shared across features:

shared/ui/

What to avoid

Do not create a component when the code is really:

a feature section
a reducer concern
an API concern

Final rule

Create a component when it improves reuse and readability without taking ownership away from the correct feature layer.