Folder Structure
Folder structure for Sanity CMS
Folder Structure
This guide provides an overview of the folder structure typically used when working with a Sanity CMS project integrated with Next.js. The structure is designed to keep your code organized and modular, making it easier to maintain and extend.
Explanation of the Folder Structure
-
app/
: This folder contains the main application files for Next.js, such aslayout.tsx
andpage.tsx
, which define the overall layout and root page of the application. -
components/
: Houses reusable UI components. It is further divided into:blocks/
: A subfolder for individual UI components likehero.tsx
,heading.tsx
, andfeatures.tsx
that are used throughout the site.index.tsx
: A component used to dynamically render pages based on content from the CMS.
-
sanity/
: Contains files and folders related to the Sanity CMS integration.lib/
: Includes utility files for handling CMS-related operations, such as client configuration (client.ts
), data fetching (live.ts
,fetch.ts
,metadata.ts
), and token management (token.ts
).presentation/
: Contains components or utilities specific to presenting data fetched from Sanity, such asresolve.ts
.queries/
: This folder holds GraphQL or GROQ queries that retrieve data from the CMS. The queries are organized into different files likeindex.ts
,page.ts
, andpost.ts
.schemas/
: Defines the data structure for your CMS content.blocks/
: A subfolder for page-builder-specific schemas, such ashero.ts
,feature.ts
, andcta.ts
.documents/
: Contains schemas for document types likepage.ts
,post.ts
, andauthor.ts
.
structure.ts
: Configures the layout and navigation of content types in Sanity Studio using the Structure Builder, enhancing the content editing experience.env.ts
: Environment-specific configurations.schema.ts
: The primary schema configuration file that imports and combines individual schema definitions.
-
package.json
: The package manifest file for the project, specifying dependencies, scripts, and project metadata. -
schema.json
: The schema configuration file that is generated with thesanity schema export
command. -
sanity.types.ts
: The types for the Sanity CMS generated with thesanity schema export
command. -
sanity.cli.ts
: The CLI configuration file for the Sanity CMS. -
sanity.config.ts
: The configuration file for the Sanity CMS.