How to tell when to create a new component?
In order to make a decision whether you have to create a component or not, i think you have to answer the following questions:
- Is it possible for your code chunk to be reused? If yes, construction of a new component seems like a great idea.
- Is your code quite complex? If yes maybe its good idea to split in separate components in order to make your code more readable and maintainable.
This advice applies regardless of framework. A new component is typically made for one of two reasons:
(1) Resuability
You will re-use this component. Re-use levels vary. Some code may be project specific but may be used in 2 places in your project but would never be used outside your project. It's still re-use.
However, if it's a highly re-usable piece of code you should really refine it and maybe publish it to the world!
(2) Organisation
Sometimes code may go on too long. There might be hundreds of lines and its just unreadable. Breaking that code down into components can aid readability and code organisation. Here, the new components should be child components of the parent.
Code structure:
You should consider placing highly reused components in a folder called components. The kind of component that could be made into / part of a third party library.
Project reusable components into a folder called apponents.
Finally, organisational components should be children of their parents and should be placed in a subfolder of their parent component.
Follow the steps before you decide to write a new component,
(i) Identify the responsibility - You should define a components responsibility before writing it therefore you know when you start writing.
(ii) When it is large - As a rule of thumb if your component code goes beyond 600 lines , divide into smaller components which makes your code easy to read and maintain
(iii) When you want to reuse - When you find a component being used in various modules, you should make it a shared component.
The above 3 rules will make help you to identify when you need to write a new component. Hope it helps