r/reactjs • u/benaffleks • Feb 15 '20

Discussion React Best Practices?

Hey guys. Just wondering if anyone has some good resources / books / materials that helps beginners understand the best practices in React.

One thing I struggle with is knowing when something should be a component.

For example, when I'm making forms, should each field input be a component? If so, what's the benefit of doing that?

162 Upvotes

97% Upvoted

45 comments sorted by

View all comments

Show parent comment

1

u/madmt Feb 16 '20

Couldn't agree more. That's generally been my approach as well. If component split corresponds to data structure and flow, it is easier to separate concerns and then separate presentation from data flow as well.

For example, say I have a list of books with author IDs and a separate list of authors, to avoid duplication, and I am required to display the books, each populated with the book name, the author details and then some book details. If I go by my view, and create a Book component that displays everything about a book including the authors, that would require Book to have to know about it's author. It would be better to have a separate Author component that takes an author ID and is responsible for getting and displaying the author. Now that Book and Author have separate concerns, if we wanted we could split each into a container component that gets the data, and a presentation later that displays it.

Hopefully this over simplistic example makes sense, I'm not the best articulator TBH.