My struggle to learn React • Hacker News Board

Re: My struggle to learn React

#91

Post by pknopf » Wed, May 09, 2018, 7:26 PM UTC

jwr wrote: post #69

rhapsodic wrote: post #6

I don't get what the benefit of using React is, aside from having it on my resume. A virtual DOM? What does that get me? It renders faster? Rendering speed is not a problem my CRUD screens have. Etc., etc. Perhaps some UIs are so complex and dynamic that they're easier to build and maintain using React. I'm not saying other people shouldn't use React, but I'm fairly certain it wouldn't give me enough payback to justi…

Let me add a different point of view. The adoption of React in the world of ClojureScript was pretty much instantaneous and total. I don't think anybody writes ClojureScript webapps in any other way these days. But the way React is used is different: it's used as a smarter mapping from application state to DOM. Clojure and ClojureScript programmers already know how to manage state and limit its spread, React (plus th…

Do you have any links/resources for using React with ClojureScript?

Re: My struggle to learn React

#92

Post by mieseratte » Wed, May 09, 2018, 7:27 PM UTC

tootie wrote: post #54

hardwaregeek wrote: post #9

Honestly I don't know how I learned React. It's not fun at all. Oh sure, the basics of React is not too hard. If you ignore all the outdated examples and code (using var, no JSX, overusing component lifecycle, not using functional components). But then learning Redux, React Router, React JSS, Reselect, Redux Thunk, Webpack, etc., is just terrible. Sure, there are tutorials for each individual library, or maybe even t…

I found react to be extremely intuitive and easy to learn. Redux and react-redux are horribly non-intuitive. So much boilerplate and meaningless terminology and stringly-typed objects. I avoid it.

React is just mapping data to XML, which may or may not end up as XML (React DOM vs. React Native). Throw in a component lifecycle, and you're good to go. Sure, it's not jQuery simple but for a modern SPA it's about as good as it gets. It allows you to just deal with things in terms of composed functions which is wicked elegant, and since you're almost surely thinking of your page and application hierarchically it maps to reality nice and clean.

Redux makes managing global / central state reasonable, and in conjunction with the `connect()` function allows you to A) pull in needed global state and B) dispatch data to be centrally processed such that your component gets to not give a shit. It'll just update as-needed. It's dumb.

Strings for types sucks (it's better with Flow, or Typescript I assume) but it is what it is... the immutability can also lead to some subtle bugs if you fuckup and mutate something, but overall I'd rather write a React app with Redux than without at this point just for ease of reasoning about the system as a whole.

If you've never dealt with this type of architecture, it can be strange at first but it makes managing state / data flow much easier.

[0] - https://medium.com/@dan_abramov/smart-and-dumb-components-7c...

Re: My struggle to learn React

#93

Post by fiatjaf » Wed, May 09, 2018, 7:30 PM UTC

I use react, react-dom and react-hyperscript. Write a component, render to the DOM. Transpile with browserify. End. Maybe there should a be tutorial that just does that, but no, people want to write a begginer tutorial that uses JSX, Babel, Redux, React Router, Webpack and GraphQL.

Re: My struggle to learn React

#94

Post by rw2 » Wed, May 09, 2018, 7:30 PM UTC

I am pretty disappointed that React won the JS UI wars and not another framework. Angular 1.0 was I think the best framework for UI around and then then they smashed that with Angular 2.0 which went into obscurity. Probably Google's biggest mistake that ended up with them losing the UI framework war to Facebook's React.

Re: My struggle to learn React

#95

Post by mephitix » Wed, May 09, 2018, 7:32 PM UTC

pknopf wrote: post #82

tootie wrote: post #54

Earlier quoted context omitted.

I found react to be extremely intuitive and easy to learn. Redux and react-redux are horribly non-intuitive. So much boilerplate and meaningless terminology and stringly-typed objects. I avoid it.

Switching from Redux to Mobx dramatically decreased my mental load. It is much more straight forward.

I want to learn Mobx. I like the conceptual model (functional, immutable) of Redux though - I'm just not a fan of all the boilerplate although I understand why it is there.

What's your take on things you miss from Redux now that you've switched over to Mobx?

Re: My struggle to learn React

#96

Post by PetahNZ » Wed, May 09, 2018, 7:33 PM UTC

pavlov wrote: post #87

IloveHN84 wrote: post #41

Earlier quoted context omitted.

Like Java/Spring. Why do not use a more simple approach, say jQuery?

Why use jQuery when the native document.querySelector/querySelectorAll methods are available everywhere these days?

Chaining and applying to arrays of elements at the same time

Re: My struggle to learn React

#97

Post by jaequery » Wed, May 09, 2018, 7:36 PM UTC

React is fine. The problem is:

1) Flux (Redux) 2) Ecosystem (Webpack)

It really feels like something out of Dr. Seuss labs, where things just feels hacked together and wants everyone fit into their use case. It's over designed and some of the process is not required for most projects.

We really need some pragmatic hackers to come in and simplify these things. Someone who can create an efficient alternative that will fit into 99% of web projects and not the 1%.

I do see Vuejs / Mobx are going that direction. But I think we need more of it.

Re: My struggle to learn React

#98

Post by tracker1 » Wed, May 09, 2018, 7:36 PM UTC

I had the complete opposite experience... I've managed to stay fairly current with JS all along from ES5 through the influence of babel and other tooling towards ES6 and now. When I first started playing with React, I felt "finally!"

I had worked with .Net (both VB and C#) in the past as well as with ActionScript (Flex and Flash) and working with EcmaScript for XML (E4X) combined with XML literals in VB.Net was very natural to me... I'd wanted something similar to build from in JS/HTML for a very long time. React did that for me.

The flux pattern made sense, but most of the earlier libraries had way too much going on... when Redux came out it was such a natural fit to me.

When I look at other state management, or even Angular (1 and new) they just feel like less to me.

Re: My struggle to learn React

#99

Post by tptacek » Wed, May 09, 2018, 7:36 PM UTC

gorpomon wrote: post #38

tptacek wrote: post #19

Earlier quoted context omitted.

So don't use Redux, React Router, and Thunks. I don't even know what React JSS is. Use create-react-app's tooling. Even Redux's author tells people Redux is overused. A pretty big percentage of the value of the flux pattern is just in having an event pubsub system, so if your application is so complicated that you really feel like you need to structure it, you can just use EventEmitter. I frankly don't understand the…

I mean this in a nice way, I'd really appreciate a gist showing how you get the core concept of react-router in 50 lines. It's in a project of mine now and maybe it shouldn't be.

You have a top-level component whose render function retrieves the current URL, checks it against a bunch of regexes, and based on that decides which "page" to actually render. The regexes capture "parameters" in the URL with capture groups, and they're passed as props.

You also have a few (single-digit) lines of code to wire up the history API so that the back button works.

You have a tiny helper function that uses the history API to directly navigate to a URL inside your application.

You have a tiny Component that renders an ... whose onClick calls that helper function.

I'm sure React Router does a lot more than this. I mean, it'd have to, right? It's so complicated. But I don't know what those things are, because until I'm forced to, I'm not going to bother with it.

Similarly: I appreciate flux and think Redux is a reasonable implementation of it, but at this point, after doing a couple applications with it, I'm going to get as far as I can with a simple EventEmitter and hierarchical state before I bring it into a project. For straightforward applications --- really, a pretty big chunk of the apps I see are fundamentally straightforward --- I don't think it's a win.

Re: My struggle to learn React

#100

Post by pygy_ » Wed, May 09, 2018, 7:40 PM UTC

patricius wrote: post #68

I just have to mention Mithril.js ( https://mithril.js.org/ ) here as an alternative to React. It has built-in routing and XHR, and I think it is fairly easy to learn. Combined with the (optional) streams library, it makes developing web UIs extremely pleasant. Like React, it is also based on virtual DOM diffing. As a very minor point, I think its surface API looks more JavaScriptesque. For example, the life cycle ev…

Mithril is conceptually very close to React (it was released a bit after, but developed independently), and it comes with less cultural baggage.

It can be used productively with plain ES5, thought it also supports JSX and ES6 constructs (or even TypeScript) if you like it. I'd recommend TypeScript for large apps, actually.

The API is also closer to the plain DOM (e.g. no synthetic events). More advanced uses of the lib will lead to learn common Web standards (JS/DOM) rather than framework-specific idioms.