Self Hosted Manual Setup

1. Choose a Git provider, database adapter, and auth provider

You will need to choose a Git provider, database adapter, and auth provider. You can use any of the providers we have created, or you can create your own. In the example below we will use GitHub, Vercel KV, and the TinaCMS Auth.js provider.

If the Git provider, Database adapter, or Authentication provider you require is not available, you have the option to create your own. For assistance in this process, please refer to the documentation for self-hosted solutions, which provides detailed guidance.

2. Install the dependencies

Install any dependencies for your chosen git provider, database adapter, and auth provider (This may very to depending on what you have chosen)

3. Create a database file

Create a file called database.{js,ts} in the tina folder of your project. This file will be used to create the database.

tina/database.{ts,js}

4. Host the TinaCMS Backend

You will need a backend endpoint that hosts the GraphQL and auth api endpoints.

In this example we will show how to host the GraphQL API on Vercel. You can use any hosting provider you want (code may need to be adjusted to suit your chosen framework).

For more info see Backend Host

Hosting it outside Next.js

The sample above is a Next.js API route, but TinaNodeBackend itself is not tied to Next. It is a plain Node (req, res) handler that expects an already-parsed req.body, so anything able to hand it that pair will serve it.

What it cannot do is mount directly in a route whose signature is the web Request / Response API, which is what Astro's APIRoute and SvelteKit's +server.ts give you. Two shapes work instead:

  • Mount it in a Node server. Frameworks that can build to Connect/Express middleware, such as Astro via @astrojs/node in mode: 'middleware', let one server handle /api/tina/* with TinaNodeBackend and pass everything else to the framework. Scope the body parser to that path, app.use('/api/tina', express.json()): TinaNodeBackend needs req.body populated, but parsing every route consumes the stream the framework needs for its own form posts.
  • Deploy it as a standalone serverless function beside your site: Vercel Functions or Netlify Functions. tina-self-hosted-static-demo is a working example of a static site with the backend as its own function.

5. Update the TinaCMS config

Update the TinaCMS config to use the GraphQL API you created in the previous step.

Now you should be able to run your site and use TinaCMS to edit your content. See the docs on the configuration components for more info on how to self-host TinaCMS.

Next Steps

  • If you want to change your Git provider, database adapter, or auth provider, check out the reference.
  • Got questions? Feel ask in our Discord
Last Edited: November 19, 2024