⚠️ Heads up: ⚠️ This article is an opinion and experiment. I am open to comments and criticisms of this approach.
UPDATE: 23 November 20...
For further actions, you may consider blocking this person and/or reporting abuse
Hey, nice article!
As a small improvement, I'd suggest using streams in
MovieService. getMovies
instead of promises: it'll be easier to manage requests, especially if two clients (e.g. widgets) are trying to fetch the same data.Also, please check out this article of mine:
Fetching Data in React with RxJS and <$> fragment
Kostia Palchyk for RxJS ・ Aug 4 '20 ・ 5 min read
And yeah, there are many packages that try to integrate React and Rx, but it's still definitely worth investigating this direction, as I'm sure there are many things yet to be found!
GL
Oh regarding the movies being accessed from multiple widgets, I agree, this is an immediate problem I thought of but figured for the experiment i would put that aside for now. It is definitely not well structured in its current state and I will definitely check out using streams
Thanks for the comment and
Ah yes! This is exactly what is was playing with last night! Great article by the way!
I’m still fighting the idea of mixing API requests with subscriptions.
For my experiment I want to try and completely separate fetch from the subscriptions.
I’m not even quite sure what I want to do after reading all the amazing comments and links to existing libraries
Keep on exploring and experimenting 👍
Nice summary - RxJS / reactive programming is really great :)
I'm wondering if instead of all the useEffect stuff, maybe you can just use an observable hook like useObservableState:
See useObservableState
This is super interesting! This is actually what I had in mind for the next step.
Can you show example of code on how to remove movie on the server e.g. do a REST call
DELETE http://localhost:3000/movies/id
?Sure! I want to focus on writing a custom hook first. The code for deleting on the server would really depend on your application backend setup
We can assume pretty standard REST JSON API endpoint (like in Rails)
Another slight variation of the same idea
Another suggestion is to look at RxDB - then you can extend the reactivity all the way to do the database. The content "state" is basically pushed to the database, only exposed as hooks in your SPA.
The article "I like RxJS" on the DEV Community celebrates this admiration for RxJS among developers. With its reactive programming paradigm, RxJS offers a wealth of possibilities for managing complex asynchronous operations in React applications Downloadhub. The author delves into their personal experiences and reasons for embracing RxJS, highlighting its ability to handle events, manage state, and simplify complex data flows
I use rxjs-hooks in React Projects. Hope it can help u!!!
Great thank you.
You can be interested by this ReactQuery
Regards
Futhermore, perhaps you don't need a big library like RxJS , flyd is perhaps a lighter alternative look at this
You can test it here FlydStream
Love React and RxJS and would definitely recommend you check out redux-observable - it's great...
redux-observable.js.org/
Absolutely love RxJS! It's a game-changer for managing asynchronous operations and makes coding so much smoother. whatsapp plus original