1

I just watched this video on youtube, where we can see that a preview of the page is being instantly dynamically generated within the studio, while the person is adding the components randomly from the dropdown and editing its content.

What I want to know:

Is this dynamic generation limited to just the preview generation, or is the new page actually created dynamically on the nextjs frontend, with the components that person is adding to page structure randomly ?

I'm very new to react, nextjs, and the whole headless cms concept... and to be honest its a bit overwhelming handling all of this at once

If anyone can shed some more light on this, please do!

Thanks,

I have been able to create individual templates with re-usable components. But I haven't able to achieve what's shown in the video.

For my current setup, if somebody is creating a page structure on sanity studio using the re-usable components, I'll still have to create a new template for the newly created page structure, to query and display the components accordingly

1 Answers1

0

I might be wrong but from what I've seen, he has a set of ready components (e.g Hero Section component, Open text section, Product section, etc.) then in his dynamic page say for an example pages/[...slug.tsx] he fetches those Page document using the slug (e.g slug == 'home' then it fetches data from the home document) from his Sanity Studio then renders each component that's in the data which basically makes the whole page.

Steven
  • 518
  • 2
  • 4
  • 12
  • You're correct about the ready components, but for the data fetching part from sanity, he would then have to create multiple page type documents (home, about, contact, services, etc.) But in the video, we can see only one document type created, i.e, Page. This is what I'm not being able to understand... what logic is being applied here, that he's being able to create multiple pages, with varying layout structures, from the same, one document type called "Page" – Rockafella96 Apr 28 '23 at 10:50
  • @Rockafella96 From what I've understood, he defined schema fields such as "Hero Section", "Feature Section", "Grid Section", etc. as the building blocks of how a Page will look. As for the fetching part, you'd have to fetch with a groq query pointing to the `slug` then also include to query the different kinds of sections you've defined in your sanity schema in the groq query, expect the sections to be an array of sections. Now since you have an array of sections, you'd have to render them conditionally with their respective components. – Steven May 09 '23 at 09:01