Hey. I know Next.js is primarily used for its SSR capabilities but I've seen multiple posts where people say Next.js can be used to build an SPA just fine, but also posts that don't recommend it.

I want to make an application that is an SPA but that would allow me to add SSR (e.g. only on some routes) down the line. That way I don't have to rewrite the entire project when the time comes for SSR, I'm hoping to just enable a flag or change something on the pages/components I want SSR in. Unless I have SSR components, I want the project to run completely without a server (we have a separate backend written in .NET).

[The docs](https://nextjs.org/docs/app/building-your-application/rendering) make it seem like this is possible:

React and Next.js allow you to create hybrid web applications where parts of your code can be rendered on the server or the client.

And also [here](https://nextjs.org/docs/app/building-your-application/deploying/static-exports)

Next.js enables starting as a static site or Single-Page Application (SPA), then later optionally upgrading to use features that require a server.

I'm trying to implement this but I'm having some problems with understand what this would look like.

My current understanding is that I need to add "use client"; on all components & layouts, and remove it where I want SSR.

However, [in the docs it says that the root layout is always a server component](https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#interleaving-server-and-client-components).

Starting with the root layout, which is a Server Component, you can then render certain subtrees of components on the client by adding the "use client" directive.

(questions below because of character limit)