How to deploy a fullstack react application?

Stephane Smirnow — Tue, 17 Aug 2021 12:37:07 +0000

Hi there!

I have a React front-end + backend working perfectly in development mode. My backend is a simple server.mjs file within my React directory tree, which I launch using “node src/processes/net/server.mjs” from the React root. Note: all is running localy, and is also intended to run localy in production, so the entire frontend-backend will run on localhost only.

Now, being at the end of the development, I decided to serve the whole thing built. So, I “yarn build” to create the React build directory and accessed it successfully through “npx serve build” (after having installed serve module).

But there is no trace of my server.mjs backend in the build directory. Probably is it in the js package that has been build? In which case, anyway, I have no clue on how to launch it now ^^’ Did I do something wrong?

Thank you in advance!

Why would a React component recreate all its memoized children ?

Stephane Smirnow — Tue, 10 Aug 2021 12:29:08 +0000

Hello from Belgium,

I have a tree of similar components, each memoized with a custom areEqual. They represent a directory tree in reality. Only the root component knows the full directory structure, and pass down that information recursively to its children as a prop. It is working perfectly well: if I "fold" a child, in exemple, the areEqual functions are called only for that child parents and nothing else is rerendered.

My only problem is when I fold the root component: the root areEqual is tested, return false (as expected)... and then all the children of the whole tree are unmounted/remounted, without a single call to their areEqual functions! In the inspect Profiler companion, I see those children "created for the first time", indicating me that the root parent, when rerendering, considers all its children as being new.

So my question is as fellow: the children areEqual function not being called, they are obviously not recreated because of a prop change. But after several hours of testing, I still don't have a clue on why the root parent consider all of its childrens to be new components. Do you have any idea on how to determine why a component considers its children components to be new instances – even if there are all supposed to be memoised instances ? I'm completely lost on this one :(

Thank you very much in advance !

DEV Community: Stephane Smirnow

How to deploy a fullstack react application?

Why would a React component recreate all its memoized children ?