[natmaster]

React is really very simple. It only takes a short amount of time to learn it, and then when you do you won't get headaches all the time trying to keep track of state.

You don't need to know all the toolchains and crap if you just use create-react-app.

[theseanz]

I did not have a simple experience with React. I did front end development for years, ending with jQuery-driven AJAX sites pulling from REST APIs (2013), and when I tried to learn React this year it was all voodoo.

Is there a good tutorial out there for lapsed front-end devs?

[jpinnix]

reactforbeginners.com

[dhruvkar]

Good to know. Just trying to find a thread (in front-end dev) to latch on to was challenging.

So I threw out everything, and just started from HTML on Gitlab Pages. I've added on CSS, and just started adding in little JS functions. I can now (sort of) appreciate frameworks. React seems to be a popular choice.

[majewsky]

I would argue that, for a lot of sites, plain HTML + CSS + little JS functions is the right choice, because building stuff in plain JS is more painful than with frameworks. Having to do it in plain JS makes you think more carefully if you really need this JS. (At least, it does that for me.)

Also, the site loads so much faster, esp. when HTTP/2 is not an option for you (because your hosting does not support it or whatever).

I won't argue, though, that a complex web app should be built on a proper framework.

[frankquist]

I also like Vue.js and am surprised it's not getting mentioned much. But it's nice for starting out, in my opinion, since you can pretty much decide if you go all-in. It's quite possible to just use it to sprinkle some JS here and there, but also possible to build SPAs with it.

[dhruvkar]

That's what I'm looking for. I'll check it out, thanks.

[JustSomeNobody]

> You don't need to know all the toolchains and crap if you just use create-react-app.

I love the hand wavyness of this! Yes, you DO need to know the toolchain. Because if you don't, it is going to be murder on you if you need to track down why something isn't working.

Professional developers need to use professional tools and understand them deeply. There's no compromises here.

[gschrader]

While I agree you need to know the toolchain, create-react-app is a professional tool, it works very well. I've struggled before configuring webpack/babel/etc. manually and while it may "murder" me down the road one can always eject if need be.

[atemerev]

React is simple, right until the point it isn't anymore.

The point of breakdown probably starts with Redux. There is no simple way of structuring multi-component pages in React. All is suddenly complicated.

[thatswrong0]

I'm confused what you mean by "multi-component pages". I work with a mildly complex React SPA using a library like Redux and we haven't really had issues with things becoming too complicated.

[atemerev]

http://redux.js.org/docs/basics/ExampleTodoList.html — this is already too complicated (13 JS files for a todo list!)

[thatswrong0]

Maybe it's because I work everyday in a React codebase that is sitting at 150k+ lines of similarly structured code, but I don't find that to be complicated at all. Structure almost always adds overhead, but with the benefit of adding consistency and familiarity. The # of files does not indicated to me how complicated something is.

When I think complicated, I think of code that's hard to understand, hard to modify, or hard to find things you're looking for in. In that example, everything is exactly where you'd expect it to be:

1) Where do I render / present my data? In the presentation components.

2) Where do I take data from the store and pass it to my presentation components? In the container components.

3) Where do I modify data in my stores? In the reducers.

4) Where are my reducers exposed to my container components? In the actions.

Maybe this kind of structure is overkill for a Todo list, but for a complex SPA, this kind of structure is useful and almost makes it _easier_, not harder, to find the things you're looking for. The app I work in is constantly growing and getting more complicated, esp. in regards to the quantity of features, yet I don't find it to be getting harder to go back and find or change things. I think this is due to the functional nature and design of React combined with the architecture we chose that makes this possible.

And in terms of LoC, that example doesn't seem to be much different from the Angular / Backbone implementations of TodoMVC.

[thatswrong0]

* almost always