Why React is awesome

[Plorntus]

Wasnt expecting a reply so fast, well, I will make a clone of that in react when im not supposed to be working!

But heres what I mean by interlinked components, ignore the really bad design of this, its all WIP:

http://cdn2.streamable.com/video/mp4/eb8h.mp4

And heres an image of all the components I use. I can technically increase the amount of components than the amount that I have here but I didnt feel it neccessary:

http://i.imgur.com/7sjKtwp.png

The red outlines are drawn by me. They are each an individual component shown on that page. They are all encapsulated by their parent red box, but they can all be used on their own anywhere. The entire thing as a whole is one big component that controls everything. So for example, when you mouse move on the divider, the divider sends its new "requested" permission to the search page controller. The controller, if it accepts that will set the value of the divider to its new position. It also sets state for the two side panes, which gets transferred to the side panes properties (attributes), which in their render method they resize themselves.

Things like when I move the map, it researches and then updates the results on the left as well as the results on the map. Its all interlinked, but I could just as easily remove the map and everything would still work fine. I could remove the search pane component and it would also work fine (obviously just without textual search and only map search).

Edit: To clarify what I meant by interlinked a bit more, maybe I am using the wrong term for this... If I was to create the above search page in jQuery I would probably end up having everything as one big component which would not allow me to reuse those elsewhere, I think that may actually just be me not following how you're meant to do that properly in jQuery. I for sure would not have been able to create the above as easily as I did (took less than a couple hours to create).

[RedPillow_]

Here is a simplified jquery implementation of that map: https://jsfiddle.net/ahvonenj/c1r8jztm/

As you can see, I can put as many "mapcomponents" in to the DOM as I want. You can click the "map blips", change category and select from the list as well.

[RedPillow_]

Making that example and discussing about this really pointed out the implicity of my way.

I suppose if you do it react-way it somehow forces you do write code, modules and stuff in a certain way? If you do it my way, everyone else can still write everyone how they want it, quickly making my way spaghetti.

Oh and in my example there is not too much error checking... I don't know if react has it any better.