Compatibility with Nextjs 13 app's directory and server components

Hi team,

Now that Nextjs 13 has been released supporting React server-components in the new app directory, any guidance in the documentation on how to best integrate would be appreciated.

The best solution I have found so far is to fetch the page data through the content API in a server component, and pass it to a child client component which contains the imports
BuilderComponent, builder to render the page. This is needed because the different Builder components use React.createContext, which are not supported in a server component.

Please also consider making the SDK natively compatible with the new app directory in Nextjs 13.

Thanks in advance,
Vincent

3 Likes

I’ve tried the approach you’ve outlined using only a page model, but it seems rendering is one cycle behind. For example, I go to page 1, nothing is rendered, then I go to page 2, and page 1 is rendered. This happens when I use import { builder } from '@builder.io/sdk'; and builder.get('page', { url: url }) and pass the result to the client.

However, if I fetch from the client component, it works.

Any ideas why?

I would love that feature too, or a workaround at least to make it work :thinking: