Using r-layout with react 0.13

[ilyabo]

Would like to upgrade my app to react 0.13 and continue using this fantastic library. Unfortunately, r-layout specifies React 0.12.x as its peer dependency. Is there really any strong reason that makes it impossible to use r-layout with the latest React?

[Zinggi]

There is probably no reason for that, however I haven't tested anything with React 0.13 yet, so I don't know.
I have not looked at the changelog of React 0.13, so maybe some functions I was using were deprecated.

Unfortunately I'm going on a long holiday tomorrow, So I can't do that any time soon.

If you can test it on your machine and if necessary do some adjustments to make it work with 0.13, you're very welcome to send me a pull request and once I've got internet I will accept it.

Sorry that I can't be of any help.

[Zinggi]

Hey there, sorry for the long silence.
I'm sorry to tell you this, but I won't upgrade to react 13 anymore.

The reason for this is that I decided to stop the development of this library altogether. Why?

First of all, I stopped using react, so this library is no use to me anymore. Therefore my motivation is very low.

Second, I think this library wasn't a very good idea in the first place. Don't get me wrong, I still think that css is ill-suited for layouting and that specifying weights instead of percentages is a good thing, but this library achieves this by mixing your markup with the layout. This makes it inflexible to layout changes. Furthermore, it produces bad html with many unnecessary divs. There has to be a better solution!

[ilyabo]

Hi Florian,

Thanks for your answer, I appreciate!

I am actually using r-layout with react 13 without any problems (beside having to use the old createClass syntax because of the resizemixin).

I guess, a better way to do the layout would be to use flexbox. However, as long as IE9 and 10 are around, this is not an option for everybody.

Maybe there are some types of layouts for which R-Layout isn't the best solution. But in my case, it is just perfect for defining the basic layout of a desktop-like web app which has to adjust gracefully to window resizes. Doing this in CSS is a nightmare. Doing this with your library is just beautifully simple and straightforward.

I don't see that mixing logical components and layout is really a problem, especially, in the light of the recent CSS in JS movement. And I couldn't care less for the few unnecessary divs :)

That's a pity that you won't support the library anymore. Mind if I take over? I created a fork in which I plan to make a few improvements: in particular, getting rid of the ResizeMixin, adding support for user-adjustable layouts, doing some renamings.

BTW, just curious, why did you abandon React, what are you using instead now?

[Zinggi]

Hey,
I'm currently on holidays with only occasionally internet. I'm gonna write a full response when I get back in a bit more than a week.
You can take over if you like.

[Zinggi]

I guess, a better way to do the layout would be to use flexbox. However, as long as IE9 and 10 are around, this is not an option for everybody.

I agree, flexbox is no viable option and sticking to css that is supported everywhere is painful.

I don't see that mixing logical components and layout is really a problem, especially, in the light of the recent CSS in JS movement. And I couldn't care less for the few unnecessary divs :)

I'm all in favour for CSS in JS because you have an actual programming language at your disposal for layouting and styling which is way more powerful than basically a configuration file (css).
However, I think we should still try to separate the markup from the presentation as good as possible. How this would look like ideally I don't know.
Also, It doesn't just produce a few unnecessary divs, if you use a <Center> you get 5 divs and 4 noscript tags instead of just one div. It's pretty bad.

BTW, just curious, why did you abandon React, what are you using instead now?

I'm not using react anymore because I'm not doing any frontend development at the moment. So for the next project I would probably still choose react or maybe use elm instead