From the course: Learning Full-Stack JavaScript Development: MongoDB, Node, and React

Unlock the full course today

Join today to access over 24,800 courses taught by industry experts.

Sharing data between server and client

Sharing data between server and client

- In index dot tsx, we're rendering the contests with an empty array. So let me demonstrate what's going on. In contest list, I'm going to put a debugger line here. So every time React renders a contest list, it's going to stop for us in the browser and let's test. The first time we hit this debugger, note how we already have the initial markup coming from the server even before React renders any components. Then we render the contest list and we render it with an empty array. So basically React wiped the initial markup that we got from the server, rendered the naming contests with an empty array, and it then goes to the server again to get the data and renders the application again with that data. So that's not ideal. We don't need to do that. This is an extra API call and also wasteful re-rendering. We don't need React to re-render. It already has the same application rendered in the browser. It does not need to wipe…

Contents