Hacker News new | ask | show | jobs
by a13n 3655 days ago
So https://productpains.com is entirely written in React and React Router (no Redux, yet).

I have a few wrapper components that know how to fetch various datas (a product, post, etc). They then pass this data into their children via props. When the user makes a mutation (vote, comment, post, etc) I'll let my server know to make the mutation and then do one of two things:

1. Optimistic: "Fake" the mutation using state until the server response comes back, then reload the data

2. Loading Indication: Give some sort of indication that the mutation is happening (eg. a spinner) and then when the server response comes back, reload the data

We don't currently update data live when there are changes on the server. This could be trivially implemented with polling. Or the more complicated solution would be to use a socket and subscribe to certain datas on the server which would get pushed to the client upon mutation. (see GraphQL Subscriptions! http://graphql.org/blog/subscriptions-in-graphql-and-relay/)

1 comments

I.e. you suggest to use no library, but just ad-hoc DIY XHR/websocket/whatever-else-works to do what React doesn't?

I was asking exactly because I've already tried this and didn't like the process and results. Used the loading indication approach, with models having `pendingUpdate` flags. Basically, I felt that I'm writing ton of unnecessary code that had to be written only because things are too low-level. Like I was re-solving already solved problems.

React does the UI layer, but DIY data model + persistence layers aren't fun. What I'm looking for, is something like Angular's $resource (or its extensions) for React. Something that hides away the unnecessarily gory details (low-level XHR stuff, URL construction, maybe even data validation) behind a programmer-friendly API facade (`Item.save`), plays well with React and those fluxish patterns, yet doesn't enforce any special requirements on the server-side tech (i.e. can be used with existing Django/Rails/PHP backends).