Understanding how a ReactJS and NodeJS app can work
I'm trying to learn React JS, but I am having a hard time understanding how it should work with NodeJS, say with Express.
So far I understand that ReactJS is "V" in "MVC" This is easy, I can already write code using create-react-app
This is how I understand it:
-
The "natural" way to combine React and Express is to just write an interface in React and an api in Express (eg Mongo). This way we can just make ajax calls from React to our / api and show the data
-
there is also the option to use React for server side rendering, which requires a little more customization. This way we don't call / api from React, we just use React to write code that Express can render
My question is, am I thinking right? Not sure about all of this ... Is Isomorphic JavaScript somehow related to C # 2?
source to share
You are mostly correct, but using server side rendering does not mean that you are not making api requests either. Server side reflection is a technique used to improve initial load times. Instead of pulling out your javascript package, which then makes some api calls to load a lot of data that it should display, you instead do an initial render and load of the app on the server. The resulting html and the initial state of the application are then returned to the client so that the application can be immediately shown to the user. So when it comes to server side rendering, react, it really is about bootstrapping.
After loading initoal, you still have a dynamic interface app. You are still getting api requests as the user interacts with the app. If I go to a different route in an application (assuming it's a single page application) that requires additional data, I will still issue a GET request to load that data. If I click the button to update the resource, I will still issue a PUT or PATCH request.
So, in terms of the question of how to express and react to match each other, an expression (or whatever language you use to work with the backend) allows the api to interact with the data in your data store. And react allows you to create views that consume these apis. The server side screwdriver is another technique you can use, rather than an entirely separate paradigm.
source to share