Creating a Site Builder with NextJS and Sanity CMS

• nextjs-blog-cms-sanity-v3

  1 372 9.3 TypeScript

  A Next.js Blog with a Native Authoring Experience

  

With Sanity being a headless CMS, we have the freedom to render our components and style the site however we want. I'll speed through some of the logic here to get to the interesting parts (you can find the general approach in the NextJS + SanityCMS blog starter).

• cms-site-builder

  1 3 3.9 TypeScript

  Starter for a basic website builder where content can be defined in a headless CMS

This is achieved in sanity.config.ts. The previewStructurePlugin function places the 2 variants of singletons Sanity Studio sidebar and configures the preview as needed. We also need to remove them from the global "new document" button, so we pass them to singletonPlugin, then add the "open preview" button to the desired preview singletons via productionUrl. All the other documents (just pages here) go to previewDocumentNode.

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• nextjs-sanity

  1 0 10.0 TypeScript

  Discontinued Starter for a basic website builder where content can be defined in a headless CMS [Moved to: https://github.com/Tim-W-James/cms-site-builder]

You can browse the source code for the schemas I'll be discussing here, and check Sanity's documentation if you want to add your own.

• zod

  291 30,630 9.1 TypeScript

  TypeScript-first schema validation with static type inference

We'll be using zod to do that validation at runtime:

• Journeys-Continue

  1 0 3.8 TypeScript

  Website for Journeys Continue, an Australian business for social work, disability and aged care services

You'll want to configure incremental static regeneration to ensure published changes to CMS data are automatically pushed to the main site (see this file - be aware that if you update the schema you'll also need to update the logic that handles that revalidation). This allows you to trigger re-validations on only data which has changed, rather than rebuilding the entire app.

• InfluxDB

  www.influxdata.com featured

  Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  

Suggest a related project