Docs

Learn

v.Latest
Documentation
Install TinaCMS 🦙
We have specialised Starter Kits to get up and running even more quickly, but here we'll go over adding the CMS to an existing project.

Now we're ready to start adding in Tina!

  1. From your project directory, install Tina by running npx @tinacms/cli@latest init.
  2. Select NextJS as the framework.
  3. Choose NPM as your package manager.
  4. "Yes" to TypeScript.
  5. Grab a coffee while TinaCMS is added to your website ☕.
  6. 🪟 Windows only – update your dev script in package.json file to "tinacms dev -c \"next dev\"".
  7. Run npm run dev to start your new Tinafied NextJS app!
  8. Access your new Tina editor by going to http://localhost:3000/admin/index.html

DELETE the src/pages/ directory, this is generated to ensure compatibility with older versions.

Since you just set up TinaCMS, you might notice there's no content to edit yet. This is because Tina needs knowledge of a model to determines what data your pages need! We'll add that in the next step.

Last Edited: March 27, 2025

Join the Herd!

Become part of our coding comunity and stay updated with the latest tips and news.