Vitify Nuxt

Vitify Nuxt is an opinionated admin starter template that combines the Vuetify component library with the Nuxt framework to give you a production-ready dashboard base with SSR, authentication, and zero-config Netlify deployment.

What is Vitify Nuxt?

Vitify Nuxt is an open-source (MIT) admin starter template created by KingYue737, built on Nuxt 4 and Vuetify 4. It takes a fresh Nuxt project and produces a working admin dashboard with a drawer layout, route-driven navigation, Pinia stores, theme customization, and built-in authentication using nuxt-auth-utils. The template is written in 100% TypeScript and uses pnpm as its package manager.

Key Features

• SSR out of the box — Powered by the Vuetify Nuxt module, the template supports server-side rendering without extra configuration, along with SPA mode and file-based routing.
• State management with Pinia — Includes a preconfigured Pinia store, plus a notification store for common admin UI messages.
• Authentication with nuxt-auth-utils — GitHub OAuth is wired in out of the box; you can switch to any OAuth provider supported by nuxt-auth-utils or write a custom one.
• Auto-generating navigation — The drawer and breadcrumbs are generated automatically from your route structure.
• Data visualization with nuxt-echarts — Apache ECharts is available as a Nuxt module for building charts and dashboards.
• Theme customization — Color theme customization and dark mode are included, and the layout is responsive.
• Testing suite — Unit, component, and E2E tests are set up with @nuxt/test-utils.
• Zero-config Netlify deployment — Deploy to Netlify with no extra configuration, thanks to the included Netlify preset.

Who is it for?

Vitify Nuxt is aimed at Vue developers who want to bootstrap an admin dashboard without wiring up Vuetify, Pinia, auth, and deployment manually. It also suits teams that need a TypeScript-first, test-covered starting point for internal tools or SaaS back-office apps.

What can you do with Vitify Nuxt?

• Vue developers: Scaffold a new admin dashboard in minutes using npx degit kingyue737/vitify-nuxt my-app, then run pnpm i and start developing.
• Teams building internal tools: Use the built-in drawer/header/footer layout, route-driven navigation, and notification store to structure an operations console.
• Indie hackers: Deploy a client-facing admin area to Netlify with zero config, taking advantage of SSR for SEO and performance.

How does Vitify Nuxt work?

You create a GitHub OAuth application with a callback URL of http://localhost:3000/api/auth/github, add the client ID and secret plus a session secret to a .env file, and run pnpm run dev. The template handles the rest, and the auth module generates a session secret automatically in development if none is set.

Pricing

Vitify Nuxt is free and open source under the MIT License.

FAQ

Is Vitify Nuxt free?

Yes. The template is released under the MIT License, so you can use it for commercial and personal projects without a license fee.

What versions of Nuxt and Vuetify does Vitify Nuxt use?

The badges show Nuxt 4 and Vuetify 4. The template integrates the official Vuetify Nuxt module for SSR, and it uses Nuxt 4's file-based routing and module system.

How do I set up authentication?

Create a GitHub OAuth application with the homepage URL http://localhost:3000 and callback URL http://localhost:3000/api/auth/github. Then put NUXT_OAUTH_GITHUB_CLIENT_ID and NUXT_OAUTH_GITHUB_CLIENT_SECRET in your .env, plus a NUXT_SESSION_SECRET of at least 32 characters.

Can I deploy Vitify Nuxt to Netlify?

Yes. The template is described as zero-config on Netlify, meaning you can connect your repository and the build will use the Nuxt Netlify preset automatically.

Does Vitify Nuxt include tests?

It ships with unit, component, and E2E testing configured via @nuxt/test-utils, so you can run the provided test suite and add your own tests.