Learning a little React currently. I'm finding myself confused about some of the utility here. One sticking point that seems to (for me, at least) undermine it's value is that If I want to sync my UI to data residing on the server (which can and will change), I need to manually poll the server? Aside from component-based architecture, I'm not sure how this is getting me further than well structured and logically implemented AJAX. Even in the React docs, they're using JQuery in this regard. https://facebook.github.io/react/docs/tutorial.html#updating-state
I'm sure I'm missing the forest for the trees or whatever.
Thanks!
React is (citing their page)
a javascript library for building user interfaces
The main focus is to build a view layer for your application. This means you have full freedom in choosing what to use to fetch your data. For simple uses it can be jQuery or fetch.
It's generally recommended to not fetch data directly in your components and use one of Flux pattern implementations, e.g. Redux.
If your application has to be constantly powered by new data from server you can think about using something like RethinkDB on your backend and connect it to Flux store on your frontend.
Related
I have external api hosted in the cloud and I would like to write desktop app for management. Last version of electronjs I worked with was version 8 and over that time a lot of changed especially from security perspective. The concept of preload was introduced and I would like to know is it fine to write renderer as react app with redux toolkit and make api calls that way or should I use preload script to get data on the server side.
I would like to know what is a proper way of writing such app.
Yes, it is totally fine to use react and redux toolkit in your renderer.
To quickly get started, you could use something like electron react boilerplate or one of the several other boilerplates available online.
I don't understand why you would want to use preload to fetch from the server.
You can treat the renderer as just another browser instance and make requests to the server directly from your react app using fetch or xhr.
Preload is generally used to run code before the renderer has loaded. I generally use it as a bypass to turning on nodejsintegrations for my electron apps, but you can read more about it in the official docs
We are writing dash board app in React that requires us to fetch data from remote API's asynchronously. Until data s fetched, dashboard widgets need to show a hour glass or something similar. Using hooks, using Redux/Saga, using a local data access service are some of the approaches we considered. We are mostly biased towards using Redux/Saga for this but want to check if there are any standard/recommended patterns used by react community.
Recent days I've seen these two libraries circling around community posts, haven't tried them myself, but maybe will be useful to your project:
https://github.com/zeit/swr
https://github.com/tannerlinsley/react-query
I recently started playing around with preact and am intrigued by the ease of use and the performance. I have also been eyeing react's new context api (preact has a library preact-context to operate the same way).
Are there any examples or applications someone can share/reference using preact that leverage combining socket.io and preact-context?
I am specifically looking to compare the "preact+preact-context" way as opposed to the "react+redux+router+thunk+saga+..." way especially as it relates to a SPA desktop-style application
The SPA application I am looking to build will be an MDI (multiple document interface) so not a content serving app where the state can all be held in redux. We are finding also that doing things the "Redux" way is adding a lot of overhead and complexity to our code, so I am trying to see if there is a better method.
What I am hoping to understand from some provided examples:
What would a SPA-type application look like without redux using context api? (I guess this is the same for react & preact)
What are the pros and cons of doing a SPA using context api?
Can socket.io be used in a context api provider in some way?
I know what angular.js is and I even had a question about it #Why use AngularJs in frontend if Laravel is already used as backend?.
but recently I started to read about React.js and from its site (its the V in the MVC) which is exactly what am after "handling the view and nothing else".
for me, I think Angular.js as an MVC framework was made to be used with something that is built with JavaScript from start to end like Node.js
and it seems like an overkill when used with something like Larval, where I simply need something to handle the frontend and nothing else + Angular have 2 main drawbacks
with the latest news about a new version that won't have back compatibility with the current version makes me even feared to start learning it just to find that more or less every project out there is using the old version which mostly is true.
angular renders the whole dom if anything got changed which again is an issue for big projects.
so based on the above, plz note that I want to learn/use JS solely to enhance the user experience not to build another Gmail or Facebook and so my question is,
could React.js be used with Laravel to handle the view and do everything Angular was going to give, or I have to use Angular liked or not?
could React.js be used with Laravel to handle the view and do everything Angular was going to give?
No
React is just for views. React components are stateful components with some really clever rendering stuff happening behind the scenes. To build a fully functional front-end app, you'd need to tie in some other code (or write it yourself).
React works well with Facebook's Flux architecture. I would suggest looking into that to learn how to manage the state of your react components.
What's key to understand here is that Flux and React are not parts of a large front-end framework. React is a library and Flux (as provided by Facebook) only provides a Dispatcher. The rest is up to you to implement. There are some pre-existing implementations you can look at if you need some help to get started.
What I like about flux is that it allows me implement things the way that fits my application best. React takes care of the heavy DOM lifting and is very easy to learn. Compared to Angular, I don't have to learn arbitrary conventions and gigantic APIs of a huge framework.
I'm trying to choose a library for client-side MVC in ClojureScript. Here's are the ClojureScript libraries I've found so far:
WebFUI (https://github.com/drcode/webfui)
Enfocus: (http://ckirkendall.github.io/enfocus-site/)
Pedestal (http://pedestal.io)
Ducttape (https://github.com/hozumi/ducttape.cljs)
C2 (http://keminglabs.com/c2/) It seems this can be used as a DOM framework.
How should I choose between them? Also, how will they compare to using AngularJS or Backbone from ClojureScript?
This is not exactly a complete framework, maybe just the V of the client side MVC but it worth to keep an eye of it.
https://github.com/swannodette/om
A ClojureScript interface to Facebook's React
Om allows users to represent their UIs simply as EDN. Because ClojureScript data is immutable data, Om can always rapidly re-render the UI from the root. Thus Om UIs are out of the box snapshotable and undoable and these operations have no implementation complexity and little overhead.
Please don't miss this read http://swannodette.github.io/2013/12/31/time-travel/
Ganelon (which I am author of) is a Clojure web microframework built on top of Ring/Compojure.
It is not exactly client-side MVC, as in general it provides a simple mechanism, that allows us to:
invoke XHR request from a thin JavaScript layer (e.g. on link click or form submit)
return JSON response containing operations to be performed (e.g. update DIV, display modal, etc.)
perform operations from step 2 through a thin JavaScript layer
Docs & demo are available here: http://ganelon.tomeklipski.com.
I am the author of Coils, another Client Side Clojure framework:
https://github.com/zubairq/coils