PacktPublishing / Full-Stack-React-Projects-Second-Edition

Full-Stack React Projects - Second Edition, published by Packt
MIT License
467 stars 541 forks source link

Separating client and server repos to serve in individual docker containers #39

Closed fullstackmepapi closed 4 years ago

fullstackmepapi commented 4 years ago

I am learning how to configure docker containers and am trying to reconfigure the current project structure to include two separate package.json one for each client and server folder. Im running into trouble when trying to compile each separately.

How should I modify the structure to be able to successfully run client and server individually? (specifically mern marketplace)

shamahoque commented 4 years ago

More than a folder structure change, you would have to rethink and rewrite the Webpack compilation code and also the server-side render code. In the book, these were structured and implemented with the intention of developing and running as a complete stack.

fullstackmepapi commented 4 years ago

Am I correct to believe that running as a complete stack is inefficient due to bundle size as well as potential down time when working on either just the client or just the server. You would need to take down the whole site to modify just part of the app?

What is the benefit of running as a complete stack? Please correct me if I am wrong, I don't believe any pros/cons were mentioned about this in your book.

shamahoque commented 4 years ago

The Webpack configuration still generates separate bundles for the server and the frontend code (as you would if the two were kept separate completely). Just the calls to compile both ends is made from a single place to keep the development flow simple, as mentioned in Chapter 2, section “Bundling React app during development”. You can rework this part to separate the compilation calls.

A situation for having to take down the whole site to modify a part of it should never really arise if the production and development environments are different. On the flip side, if you do host client and server separately, and your frontend UI relies on data from the backend (as it does in mern marketplace), the frontend functionality will be affected if the server part is down.

For developing isomorphic apps that allow server-side rendering, the server-side code needs the client-side code too. The reasons for doing server-side rendering in fullstack applications are discussed in Chapter 15, section “Selective server-side rendering with data”, Chapter 12, section “Server-side rendering with data”, Chapter 4, section “Implementing basic server-side rendering”. You can rework the server-side render code / choose to remove it.