Advice on how to enable SSR and CSR at the same time for a modern.js app

[giancarlosisasi]

Hi there

I have an application where I need the two rendering strats:

1. Client side rendering for an internal app (admin-dashboard like).
2. Server Side rendering for a public page (needs SEO)

Both will have their own pages.

I was wondering what is the correct/recommended implementation for this 🤔 . Right now I have the following:

Created two entries:

• src/csr : for client side renderng
• src/ssr: for ssr

Then, I have configured modernjs like this:

server: {
      ssr: true,
      ssrByEntries: {
        admin: false,
      },
    },

But the problem now is that all my routes have the entries prefix. Like csr/admin instead of only admin.

So for now I'm using this folder structure

Created two entries:

• src/admin : for client side rendering. (I have removed the sub folder src/admin/routes/admin to avoid duplicated paths in the URL)
• src/p: for ssr (p for public)

But still I was wondering if its ok to use modernjs like this.

Maybe its not recommended to mix ssr with csr in the same app? maybe I need to create two separated apps, one for csr and another for ssr?

Thanks!

[zllkjc]

Your usage is correct, but there's a slight misunderstanding. In ssrByEntries, each key represents an entry, not routes. For example, if you have src/csr and src/ssr, then you should configure it as:

server: {
  ssr: true,
  ssrByEntries: {
    csr: false,
  },
},

Than, all routes in csr entry is client render.