I want to integrate builder on a landing page in next js.
Screenshots or video link
When I try to integrate the a space in my next application. I see this error on builder.io.
Still I am able to see the contents I am doing the page. I want to understand what is actually causing this error here.
I have followed the same instructions specified in the documentation still I am getting this error on console
This is my folder structure.
Code stack you are integrating Builder with
Can you guide me if I am missing anything out here
Welcome to the builder.io forum.
Would you be able to share the screenshots of components/builder.tsx and page.tsx?
Sure @manish-sharma ,
please find the code for page.tsx under [[…page]] folder below
Similarly please find the code for builder.tsx below
Attaching the image of layout.tsx as well. tried to initialize the value on Layout.tsx but still I was getting the error.
Given a dummy text in the API_Key. In my actual application I have the correct public key url
Adding image of package.json as well
Can you try adding
builder.init("YOUR PUBLIC API KEY"); on both the files below imports, see if that resolves the issue.
You can find the Public API Key under Settings → Public API Key
Cool that works. Thank you so much @manish-sharma . What do you think is it ideal to initialise builder multiple times in different pages. I am trying to understand whether will this multiple initialisation adds any overhead to the browser or our application performance.
You can rest assured that initializing the builder API key on multiple pages is perfectly acceptable and won’t introduce any unnecessary overhead.
Thank you so much @manish-sharma for being real quick and providing solution.