How componetized should my components be componented?

Trying to wrap my head around components right now and get started using the Meteorhacks Flow-x system of doing things. So I’m trying to figure out how far down the components rabbit-hole I should be going in my projects.

For example let’s say I have a blog:

I’ve got to do a form for the login, make a post, and make a comment. Should I break up form elements each into components? input text box is one, text area is one, radio button is one, etc. So the client/components folders may look something like this:

app
app.forms.textinput
app.forms.textarea
app.forms.radio
app.login.form
app.post.single
app.post.list
app.post.form.create (this uses a couple input boxes from the app.forms.textinput and app.forms.textarea)
app.comment.list
app.comment.single
app.comment.form.create (this uses a just a textarea only)

Or am I breaking up into too many components and forms are simple enough for each to have there own form fields? This is not limited to forms either just components in general. Thanks for guidance!

What makes you think there is such a thing as overdoing this?

Another question would be – what’s the simplest thing that works for your situation and needs? If a simpler solution does (i.e. less componentization? or maybe it means more?) the trick, then that’s the solution you’re looking for. You can always refactor and extend things later, but for the present moment it’s always best to choose the simplest solution that can possibly work.

Since there is very little overhead you’re causing with increased componentization / splitting up of things, then in my view the above paragraph is the one with the most important question.

I’ve been finding that creating components down to the level of textinput, textarea, and radio is over-doing it; and basically duplicates the work of the underlying elements. But forms, singlePost, postList, commentList, etc… are all exactly appropriate.

1 Like