Hosting The TinaCMS Backend with Vercel Functions

If you are not using Next.js but are using Vercel to host your site, you can deploy the TinaCMS Backend as a Vercel Function. This function will be responsible for handling all TinaCMS requests. This includes the GraphQL API, authentication, and authorization.

If you want to see Vercel Functions in action, check out the demo repo

Configuration

Create a file called api/tina/backend.{ts,js} and add the following code:

Since Vercel Functions do not support catch all routes, you will need to add the following to your vercel.json file.

Next make sure to update your TinaCMS config to use the new endpoint.

Next make sure to update your dev command to pass in the correct port so that both the backend and frontend are running on the same port.

Now you can run your site locally with the vercel dev command