Overview

Product Tour

Using a starter

Adding Tina to existing NextJS site

Getting Started

Using the Tina editor

The JavaScript toolkit for building content management interfaces

Content Modeling

Data Fetching

Contextual Editing

Running the Local GraphQL API

Getting a Single Document

Filtering

Sorting

Paginating

Performance

Limitations

Querying a Collection

Updating a Document

Adding a Document

Querying the API

Autogenerated GraphQL Client

Read Only Tokens

Markdown

Rich Text with MDX

Block-based editing

Active Field Indicator

Editing

Validation

Custom field components

Custom List Rendering

Format and parse input

Customizing a form

Manually editing and accessing Tina's edit state

Extending a field plugin

Creating a custom field component

Advanced field customization

Customizing Tina's UI

Extending Tina

Powerful Git-based content management for teams

Registration

Projects

Users

Tina Cloud Dashboard

Connecting the site

API Versioning

Branching

Data Layer

Adding Internationalization to Tina

Non-React-based SSG support

string

number

datetime

boolean

image

reference

object

rich-text

Content Types

".tina" folder

@tinacms/cli

next-tinacms-cloudinary

The CMS

Forms

Text

Text Area

Number

Image

Color

Toggle

Radio Group

Select

List

Group

Group List

Blocks

Date & Time

HTML

Field Plugins

@tinacms/toolkit

The .tina folder



## Overview

The `.tina` folder is where the configuration, schema and UI customization for TinaCMS is located.


The `.tina` folder is normally at the root of the repo (unless a [mono repo setup](/docs/tina-cloud/faq/#does-tina-cloud-work-with-monorepos) is being used). It has the following folder structure:

- `schema.{ts,tsx,js}`
- `components` folder
  - `TinaProvider.js`
  - `TinaDynamicProvider.js`
- `queries` folder (*optional*)
- `__generated___` folder
  - `_graphql.json`
  - `_lookup.json`
  - `_schema.json`
  - `frags.gql`
  - `queries.gql`
  - `schema.gql`



## `schema.{ts,tsx,js}`

This file contains the [definition for the project's schema](/docs/schema), as well as the Tina configuration object. The schema must be the default export of this file.


See our ["Tina Cloud Starter"](https://github.com/tinacms/tina-cloud-starter/blob/main/.tina/schema.ts) for an example of how this file is used

```ts
import { defineSchema, defineConfig } from 'tinacms'

const schema = defineSchema({...})
export const config = defineConfig({ schema: schema, ...})
export default schema
```


> For help defining the Tina schema, see our [content modelling documentation](/docs/schema/)

## `components` folder

This folder is generated by the tina cli `npx @tinacms/cli init` process and contains two files: `TinaProvider.js` and `TinaDynamicProvider.js`. If these are not already in your repository, see [this](https://github.com/tinacms/tina-cloud-starter/tree/main/.tina/components) for an example. These two files are responsible for importing the configuration from the schema file, passing it to the tina provider, and dynamically loading tina so it is only loaded in edit mode.

### `TinaProvider.js`

This file handles importing the configuration and TinaProvider.

### `TinaDynamicProvider.js`

This file lazily loads `TinaProvider.js` to ensure that tina is only loaded in edit mode and does not increase the size of your production bundle.

## `queries` folder (*optional*)

The `queries` folder is optional and is used by the [experimental generated client](/docs/graphql/client/). The queries that are defined in this folder will automatically be attached to the generated client when it is built.


## `__generated___` folder

This is where all the files that are generated during the schema build process are stored. Generally speaking, these files **must be checked into source control and pushed to github** with a couple of exceptions (Listed below). The reason for this is that Tina Cloud uses the generated files in order to resolve documents.


### `types.ts`

This file is where all the types of the schema are generated. This is also where the experimental client is generated. This file is for the user to use in there site if they want to use the types or the generated client. Must be pushed to Github.

### `_graphql.json`

The Graphql AST (represented in JSON). Must be pushed to GitHub.

### `_lookup.json`

This is a lookup file that is used to resolve document names. Must be pushed to GitHub.

### `_schema.json`

The Graphql Schema AST (represented in JSON). Must be pushed to GitHub.

### `frags.gql`

This file contains the raw Graphql fragments that are generated and used by the [experimental generated client](/docs/graphql/client/). Does not need to be checked into source control.

### `queries.gql`

This file contains the raw graphql queries that are generated and used by the [experimental generated client](/docs/graphql/client/). Does not need to be checked into source control since the the code for the generated client is `.tina/__generated__/types.ts`. 

### `schema.gql` 

This file contains the raw graphql schema. Does not need to be checked into source control.





Docs

The .tina folder