feat: add clerk auth support with convex (#548)

apps/cli/src/constants.ts

@@ -13,7 +13,7 @@ export const DEFAULT_CONFIG_BASE = {
 	frontend: ["tanstack-router"],
 	database: "sqlite",
 	orm: "drizzle",
-	auth: true,
+	auth: "better-auth",
 	addons: ["turborepo"],
 	examples: [],
 	git: true,
@@ -43,6 +43,11 @@ export const dependencyVersionMap = {
 	"better-auth": "^1.3.7",
 	"@better-auth/expo": "^1.3.7",
 
+	"@clerk/nextjs": "^6.31.5",
+	"@clerk/clerk-react": "^5.45.0",
+	"@clerk/tanstack-react-start": "^0.23.1",
+	"@clerk/clerk-expo": "^2.14.25",
+
 	"drizzle-orm": "^0.44.2",
 	"drizzle-kit": "^0.31.2",
 

apps/cli/src/helpers/core/add-addons.ts

@@ -44,7 +44,7 @@ export async function addAddonsToProject(
 			frontend: detectedConfig.frontend || [],
 			addons: input.addons,
 			examples: detectedConfig.examples || [],
-			auth: detectedConfig.auth || false,
+			auth: detectedConfig.auth || "none",
 			git: false,
 			packageManager:
 				input.packageManager || detectedConfig.packageManager || "npm",

apps/cli/src/helpers/core/add-deployment.ts

@@ -68,7 +68,7 @@ export async function addDeploymentToProject(
 			frontend: detectedConfig.frontend || [],
 			addons: detectedConfig.addons || [],
 			examples: detectedConfig.examples || [],
-			auth: detectedConfig.auth || false,
+			auth: detectedConfig.auth || "none",
 			git: false,
 			packageManager:
 				input.packageManager || detectedConfig.packageManager || "npm",

apps/cli/src/helpers/core/auth-setup.ts

@@ -7,7 +7,7 @@ import { addPackageDependency } from "../../utils/add-package-deps";
 
 export async function setupAuth(config: ProjectConfig) {
 	const { auth, frontend, backend, projectDir } = config;
-	if (backend === "convex" || !auth) {
+	if (!auth || auth === "none") {
 		return;
 	}
 
@@ -20,7 +20,48 @@ export async function setupAuth(config: ProjectConfig) {
 	const serverDirExists = await fs.pathExists(serverDir);
 
 	try {
-		if (serverDirExists) {
+		if (backend === "convex") {
+			if (auth === "clerk" && clientDirExists) {
+				const hasNextJs = frontend.includes("next");
+				const hasTanStackStart = frontend.includes("tanstack-start");
+				const hasViteReactOther = frontend.some((f) =>
+					["tanstack-router", "react-router"].includes(f),
+				);
+
+				if (hasNextJs) {
+					await addPackageDependency({
+						dependencies: ["@clerk/nextjs"],
+						projectDir: clientDir,
+					});
+				} else if (hasTanStackStart) {
+					await addPackageDependency({
+						dependencies: ["@clerk/tanstack-react-start"],
+						projectDir: clientDir,
+					});
+				} else if (hasViteReactOther) {
+					await addPackageDependency({
+						dependencies: ["@clerk/clerk-react"],
+						projectDir: clientDir,
+					});
+				}
+			}
+
+			const hasNativeWind = frontend.includes("native-nativewind");
+			const hasUnistyles = frontend.includes("native-unistyles");
+			if (
+				auth === "clerk" &&
+				nativeDirExists &&
+				(hasNativeWind || hasUnistyles)
+			) {
+				await addPackageDependency({
+					dependencies: ["@clerk/clerk-expo"],
+					projectDir: nativeDir,
+				});
+			}
+			return;
+		}
+
+		if (serverDirExists && auth === "better-auth") {
 			await addPackageDependency({
 				dependencies: ["better-auth"],
 				projectDir: serverDir,
@@ -40,10 +81,12 @@ export async function setupAuth(config: ProjectConfig) {
 		);
 
 		if (hasWebFrontend && clientDirExists) {
-			await addPackageDependency({
-				dependencies: ["better-auth"],
-				projectDir: clientDir,
-			});
+			if (auth === "better-auth") {
+				await addPackageDependency({
+					dependencies: ["better-auth"],
+					projectDir: clientDir,
+				});
+			}
 		}
 
 		if (
@@ -51,15 +94,17 @@ export async function setupAuth(config: ProjectConfig) {
 				frontend.includes("native-unistyles")) &&
 			nativeDirExists
 		) {
-			await addPackageDependency({
-				dependencies: ["better-auth", "@better-auth/expo"],
-				projectDir: nativeDir,
-			});
-			if (serverDirExists) {
+			if (auth === "better-auth") {
 				await addPackageDependency({
-					dependencies: ["@better-auth/expo"],
-					projectDir: serverDir,
+					dependencies: ["better-auth", "@better-auth/expo"],
+					projectDir: nativeDir,
 				});
+				if (serverDirExists) {
+					await addPackageDependency({
+						dependencies: ["@better-auth/expo"],
+						projectDir: serverDir,
+					});
+				}
 			}
 		}
 	} catch (error) {

apps/cli/src/helpers/core/command-handlers.ts

@@ -103,7 +103,7 @@ export async function createProjectHandler(
 				frontend: [],
 				addons: [],
 				examples: [],
-				auth: false,
+				auth: "none",
 				git: false,
 				packageManager: "npm",
 				install: false,
@@ -154,11 +154,11 @@ export async function createProjectHandler(
 
 		if (config.backend === "convex") {
 			log.info(
-				"Due to '--backend convex' flag, the following options have been automatically set: auth=false, database=none, orm=none, api=none, runtime=none, dbSetup=none, examples=todo",
+				`Due to '--backend convex' flag, the following options have been automatically set: database=none, orm=none, api=none, runtime=none, dbSetup=none, examples=todo`,
 			);
 		} else if (config.backend === "none") {
 			log.info(
-				"Due to '--backend none', the following options have been automatically set: --auth=false, --database=none, --orm=none, --api=none, --runtime=none, --db-setup=none, --examples=none",
+				"Due to '--backend none', the following options have been automatically set: --auth none, --database=none, --orm=none, --api=none, --runtime=none, --db-setup=none, --examples=none",
 			);
 		}
 

apps/cli/src/helpers/core/create-project.ts

@@ -5,7 +5,6 @@ import { writeBtsConfig } from "../../utils/bts-config";
 import { exitWithError } from "../../utils/errors";
 import { formatProjectWithBiome } from "../../utils/format-with-biome";
 import { setupAddons } from "../addons/addons-setup";
-import { setupAuth } from "../addons/auth-setup";
 import { setupExamples } from "../addons/examples-setup";
 import { setupApi } from "../core/api-setup";
 import { setupBackendDependencies } from "../core/backend-setup";
@@ -13,6 +12,7 @@ import { setupDatabase } from "../core/db-setup";
 import { setupRuntime } from "../core/runtime-setup";
 import { setupServerDeploy } from "../deployment/server-deploy-setup";
 import { setupWebDeploy } from "../deployment/web-deploy-setup";
+import { setupAuth } from "./auth-setup";
 import { runConvexCodegen } from "./convex-codegen";
 import { createReadme } from "./create-readme";
 import { setupEnvironmentVariables } from "./env-setup";
@@ -46,8 +46,8 @@ export async function createProject(options: ProjectConfig) {
 		if (!isConvex) {
 			await setupDbOrmTemplates(projectDir, options);
 			await setupDockerComposeTemplates(projectDir, options);
-			await setupAuthTemplate(projectDir, options);
 		}
+		await setupAuthTemplate(projectDir, options);
 		if (options.examples.length > 0 && options.examples[0] !== "none") {
 			await setupExamplesTemplate(projectDir, options);
 		}
@@ -70,7 +70,7 @@ export async function createProject(options: ProjectConfig) {
 			await setupAddons(options);
 		}
 
-		if (!isConvex && options.auth) {
+		if (options.auth && options.auth !== "none") {
 			await setupAuth(options);
 		}
 

apps/cli/src/helpers/core/create-readme.ts

@@ -4,6 +4,7 @@ import fs from "fs-extra";
 import type {
 	Addons,
 	API,
+	Auth,
 	Database,
 	DatabaseSetup,
 	Frontend,
@@ -98,7 +99,11 @@ This project uses Convex as a backend. You'll need to set up Convex before runni
 ${packageManagerRunCmd} dev:setup
 \`\`\`
 
-Follow the prompts to create a new Convex project and connect it to your application.`
+Follow the prompts to create a new Convex project and connect it to your application.${
+				auth === "clerk"
+					? " See [Convex + Clerk guide](https://docs.convex.dev/auth/clerk) for auth setup."
+					: ""
+			}`
 		: generateDatabaseSetup(
 				database,
 				auth,
@@ -135,6 +140,7 @@ ${generateProjectStructure(
 	addons,
 	isConvex,
 	api,
+	auth,
 )}
 \`\`\`
 
@@ -258,6 +264,7 @@ function generateProjectStructure(
 	addons: Addons[],
 	isConvex: boolean,
 	api: API,
+	auth: Auth,
 ): string {
 	const structure: string[] = [`${projectName}/`, "├── apps/"];
 
@@ -317,6 +324,12 @@ function generateProjectStructure(
 		structure.push(
 			"│   └── backend/     # Convex backend functions and schema",
 		);
+		if (auth === "clerk") {
+			structure.push(
+				"│       ├── convex/    # Convex functions and schema",
+				"│       └── .env.local # Convex environment variables",
+			);
+		}
 	} else if (!isBackendNone) {
 		const backendName = backend[0].toUpperCase() + backend.slice(1);
 		const apiName = api !== "none" ? api.toUpperCase() : "";
@@ -329,7 +342,7 @@ function generateProjectStructure(
 
 function generateFeaturesList(
 	database: Database,
-	auth: boolean,
+	auth: Auth,
 	addons: Addons[],
 	orm: ORM,
 	runtime: Runtime,
@@ -449,10 +462,9 @@ function generateFeaturesList(
 		);
 	}
 
-	if (auth && !isConvex) {
-		addonsList.push(
-			"- **Authentication** - Email & password authentication with Better Auth",
-		);
+	if (auth !== "none") {
+		const authLabel = auth === "clerk" ? "Clerk" : "Better-Auth";
+		addonsList.push(`- **Authentication** - ${authLabel}`);
 	}
 
 	for (const addon of addons) {
@@ -476,7 +488,7 @@ function generateFeaturesList(
 
 function generateDatabaseSetup(
 	database: Database,
-	_auth: boolean,
+	_auth: Auth,
 	packageManagerRunCmd: string,
 	orm: ORM,
 	dbSetup: DatabaseSetup,
@@ -575,7 +587,7 @@ function generateScriptsList(
 	packageManagerRunCmd: string,
 	database: Database,
 	orm: ORM,
-	_auth: boolean,
+	_auth: Auth,
 	hasNative: boolean,
 	addons: Addons[],
 	backend: string,

apps/cli/src/helpers/core/env-setup.ts

@@ -1,7 +1,7 @@
 import path from "node:path";
 import fs from "fs-extra";
 import type { ProjectConfig } from "../../types";
-import { generateAuthSecret } from "../addons/auth-setup";
+import { generateAuthSecret } from "./auth-setup";
 
 export interface EnvVariable {
 	key: string;
@@ -143,6 +143,42 @@ export async function setupEnvironmentVariables(config: ProjectConfig) {
 					condition: true,
 				},
 			];
+
+			if (backend === "convex" && auth === "clerk") {
+				if (hasNextJs) {
+					clientVars.push(
+						{
+							key: "NEXT_PUBLIC_CLERK_FRONTEND_API_URL",
+							value: "",
+							condition: true,
+						},
+						{
+							key: "NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY",
+							value: "",
+							condition: true,
+						},
+						{
+							key: "CLERK_SECRET_KEY",
+							value: "",
+							condition: true,
+						},
+					);
+				} else if (hasReactRouter || hasTanStackRouter || hasTanStackStart) {
+					clientVars.push({
+						key: "VITE_CLERK_PUBLISHABLE_KEY",
+						value: "",
+						condition: true,
+					});
+					if (hasTanStackStart) {
+						clientVars.push({
+							key: "CLERK_SECRET_KEY",
+							value: "",
+							condition: true,
+						});
+					}
+				}
+			}
+
 			await addEnvVariablesToFile(path.join(clientDir, ".env"), clientVars);
 		}
 	}
@@ -168,6 +204,14 @@ export async function setupEnvironmentVariables(config: ProjectConfig) {
 					condition: true,
 				},
 			];
+
+			if (backend === "convex" && auth === "clerk") {
+				nativeVars.push({
+					key: "EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY",
+					value: "",
+					condition: true,
+				});
+			}
 			await addEnvVariablesToFile(path.join(nativeDir, ".env"), nativeVars);
 		}
 	}

apps/cli/src/helpers/core/post-installation.ts

@@ -69,6 +69,8 @@ export async function displayPostInstallInstructions(
 	const starlightInstructions = addons?.includes("starlight")
 		? getStarlightInstructions(runCmd)
 		: "";
+	const clerkInstructions =
+		isConvex && config.auth === "clerk" ? getClerkInstructions() : "";
 	const wranglerDeployInstructions = getWranglerDeployInstructions(
 		runCmd,
 		webDeploy,
@@ -119,6 +121,16 @@ export async function displayPostInstallInstructions(
 		output += `${pc.cyan(`${stepCounter++}.`)} ${runCmd} dev:setup\n${pc.dim(
 			"   (this will guide you through Convex project setup)",
 		)}\n`;
+
+		if (config.auth === "clerk") {
+			output += `${pc.cyan(`${stepCounter++}.`)} ${pc.bold("Clerk Setup:")}\n${pc.dim(
+				"   Follow the Convex + Clerk guide to configure authentication:",
+			)}\n${pc.cyan("   ")}${pc.underline("https://docs.convex.dev/auth/clerk")}\n\n`;
+			output += `${pc.cyan(`${stepCounter++}.`)} ${pc.bold("Required Environment Variables:")}\n`;
+			output += `${pc.dim("   •")} Set CLERK_JWT_ISSUER_DOMAIN in Convex Dashboard\n`;
+			output += `${pc.dim("   •")} Set CLERK_PUBLISHABLE_KEY in apps/*/.env\n`;
+		}
+
 		output += `${pc.cyan(
 			`${stepCounter++}.`,
 		)} Copy environment variables from\n${pc.white(
@@ -175,6 +187,7 @@ export async function displayPostInstallInstructions(
 	if (alchemyDeployInstructions)
 		output += `\n${alchemyDeployInstructions.trim()}\n`;
 	if (starlightInstructions) output += `\n${starlightInstructions.trim()}\n`;
+	if (clerkInstructions) output += `\n${clerkInstructions.trim()}\n`;
 
 	if (noOrmWarning) output += `\n${noOrmWarning.trim()}\n`;
 	if (bunWebNativeWarning) output += `\n${bunWebNativeWarning.trim()}\n`;
@@ -403,6 +416,10 @@ function getWranglerDeployInstructions(
 	return instructions.length ? `\n${instructions.join("\n")}` : "";
 }
 
+function getClerkInstructions(): string {
+	return `${pc.bold("Clerk Authentication Setup:")}\n${pc.cyan("1.")} Sign up for Clerk at ${pc.underline("https://clerk.com/sign-up")}\n${pc.cyan("2.")} Create a new application in Clerk Dashboard\n${pc.cyan("3.")} Create a JWT template named ${pc.bold("'convex'")} (exact name required)\n${pc.cyan("4.")} Copy your Clerk Frontend API URL (Issuer URL)\n${pc.cyan("5.")} Set environment variables:\n${pc.dim("   •")} CLERK_JWT_ISSUER_DOMAIN in Convex Dashboard\n${pc.dim("   •")} CLERK_PUBLISHABLE_KEY in apps/*/.env\n${pc.cyan("6.")} Follow the complete guide: ${pc.underline("https://docs.convex.dev/auth/clerk")}\n${pc.yellow("NOTE:")} Use Convex's <Authenticated> components instead of Clerk's <SignedIn>`;
+}
+
 function getAlchemyDeployInstructions(
 	runCmd?: string,
 	webDeploy?: string,

apps/cli/src/helpers/core/template-manager.ts

@@ -362,7 +362,7 @@ export async function setupAuthTemplate(
 	projectDir: string,
 	context: ProjectConfig,
 ) {
-	if (context.backend === "convex" || !context.auth) return;
+	if (!context.auth || context.auth === "none") return;
 
 	const serverAppDir = path.join(projectDir, "apps/server");
 	const webAppDir = path.join(projectDir, "apps/web");
@@ -382,8 +382,88 @@ export async function setupAuthTemplate(
 	const hasUnistyles = context.frontend.includes("native-unistyles");
 	const hasNative = hasNativeWind || hasUnistyles;
 
-	if (serverAppDirExists) {
-		const authServerBaseSrc = path.join(PKG_ROOT, "templates/auth/server/base");
+	const authProvider = context.auth;
+
+	if (context.backend === "convex" && authProvider === "clerk") {
+		const convexBackendDestDir = path.join(projectDir, "packages/backend");
+		const convexClerkBackendSrc = path.join(
+			PKG_ROOT,
+			"templates/auth/clerk/convex/backend",
+		);
+		if (await fs.pathExists(convexClerkBackendSrc)) {
+			await fs.ensureDir(convexBackendDestDir);
+			await processAndCopyFiles(
+				"**/*",
+				convexClerkBackendSrc,
+				convexBackendDestDir,
+				context,
+			);
+		}
+
+		if (webAppDirExists) {
+			const reactFramework = context.frontend.find((f) =>
+				["tanstack-router", "react-router", "tanstack-start", "next"].includes(
+					f,
+				),
+			);
+			if (reactFramework) {
+				const convexClerkWebSrc = path.join(
+					PKG_ROOT,
+					`templates/auth/clerk/convex/web/react/${reactFramework}`,
+				);
+				if (await fs.pathExists(convexClerkWebSrc)) {
+					await processAndCopyFiles(
+						"**/*",
+						convexClerkWebSrc,
+						webAppDir,
+						context,
+					);
+				}
+			}
+		}
+
+		if (nativeAppDirExists) {
+			const convexClerkNativeBaseSrc = path.join(
+				PKG_ROOT,
+				"templates/auth/clerk/convex/native/base",
+			);
+			if (await fs.pathExists(convexClerkNativeBaseSrc)) {
+				await processAndCopyFiles(
+					"**/*",
+					convexClerkNativeBaseSrc,
+					nativeAppDir,
+					context,
+				);
+			}
+
+			const hasNativeWind = context.frontend.includes("native-nativewind");
+			const hasUnistyles = context.frontend.includes("native-unistyles");
+			let nativeFrameworkPath = "";
+			if (hasNativeWind) nativeFrameworkPath = "nativewind";
+			else if (hasUnistyles) nativeFrameworkPath = "unistyles";
+			if (nativeFrameworkPath) {
+				const convexClerkNativeFrameworkSrc = path.join(
+					PKG_ROOT,
+					`templates/auth/clerk/convex/native/${nativeFrameworkPath}`,
+				);
+				if (await fs.pathExists(convexClerkNativeFrameworkSrc)) {
+					await processAndCopyFiles(
+						"**/*",
+						convexClerkNativeFrameworkSrc,
+						nativeAppDir,
+						context,
+					);
+				}
+			}
+		}
+		return;
+	}
+
+	if (serverAppDirExists && context.backend !== "convex") {
+		const authServerBaseSrc = path.join(
+			PKG_ROOT,
+			`templates/auth/${authProvider}/server/base`,
+		);
 		if (await fs.pathExists(authServerBaseSrc)) {
 			await processAndCopyFiles(
 				"**/*",
@@ -391,13 +471,12 @@ export async function setupAuthTemplate(
 				serverAppDir,
 				context,
 			);
-		} else {
 		}
 
 		if (context.backend === "next") {
 			const authServerNextSrc = path.join(
 				PKG_ROOT,
-				"templates/auth/server/next",
+				`templates/auth/${authProvider}/server/next`,
 			);
 			if (await fs.pathExists(authServerNextSrc)) {
 				await processAndCopyFiles(
@@ -406,7 +485,6 @@ export async function setupAuthTemplate(
 					serverAppDir,
 					context,
 				);
-			} else {
 			}
 		}
 
@@ -417,22 +495,21 @@ export async function setupAuthTemplate(
 			if (orm === "drizzle") {
 				authDbSrc = path.join(
 					PKG_ROOT,
-					`templates/auth/server/db/drizzle/${db}`,
+					`templates/auth/${authProvider}/server/db/drizzle/${db}`,
 				);
 			} else if (orm === "prisma") {
 				authDbSrc = path.join(
 					PKG_ROOT,
-					`templates/auth/server/db/prisma/${db}`,
+					`templates/auth/${authProvider}/server/db/prisma/${db}`,
 				);
 			} else if (orm === "mongoose") {
 				authDbSrc = path.join(
 					PKG_ROOT,
-					`templates/auth/server/db/mongoose/${db}`,
+					`templates/auth/${authProvider}/server/db/mongoose/${db}`,
 				);
 			}
 			if (authDbSrc && (await fs.pathExists(authDbSrc))) {
 				await processAndCopyFiles("**/*", authDbSrc, serverAppDir, context);
-			} else if (authDbSrc) {
 			}
 		}
 	}
@@ -444,11 +521,10 @@ export async function setupAuthTemplate(
 		if (hasReactWeb) {
 			const authWebBaseSrc = path.join(
 				PKG_ROOT,
-				"templates/auth/web/react/base",
+				`templates/auth/${authProvider}/web/react/base`,
 			);
 			if (await fs.pathExists(authWebBaseSrc)) {
 				await processAndCopyFiles("**/*", authWebBaseSrc, webAppDir, context);
-			} else {
 			}
 
 			const reactFramework = context.frontend.find((f) =>
@@ -459,7 +535,7 @@ export async function setupAuthTemplate(
 			if (reactFramework) {
 				const authWebFrameworkSrc = path.join(
 					PKG_ROOT,
-					`templates/auth/web/react/${reactFramework}`,
+					`templates/auth/${authProvider}/web/react/${reactFramework}`,
 				);
 				if (await fs.pathExists(authWebFrameworkSrc)) {
 					await processAndCopyFiles(
@@ -468,26 +544,31 @@ export async function setupAuthTemplate(
 						webAppDir,
 						context,
 					);
-				} else {
 				}
 			}
 		} else if (hasNuxtWeb) {
-			const authWebNuxtSrc = path.join(PKG_ROOT, "templates/auth/web/nuxt");
+			const authWebNuxtSrc = path.join(
+				PKG_ROOT,
+				`templates/auth/${authProvider}/web/nuxt`,
+			);
 			if (await fs.pathExists(authWebNuxtSrc)) {
 				await processAndCopyFiles("**/*", authWebNuxtSrc, webAppDir, context);
-			} else {
 			}
 		} else if (hasSvelteWeb) {
-			const authWebSvelteSrc = path.join(PKG_ROOT, "templates/auth/web/svelte");
+			const authWebSvelteSrc = path.join(
+				PKG_ROOT,
+				`templates/auth/${authProvider}/web/svelte`,
+			);
 			if (await fs.pathExists(authWebSvelteSrc)) {
 				await processAndCopyFiles("**/*", authWebSvelteSrc, webAppDir, context);
-			} else {
 			}
 		} else if (hasSolidWeb) {
-			const authWebSolidSrc = path.join(PKG_ROOT, "templates/auth/web/solid");
+			const authWebSolidSrc = path.join(
+				PKG_ROOT,
+				`templates/auth/${authProvider}/web/solid`,
+			);
 			if (await fs.pathExists(authWebSolidSrc)) {
 				await processAndCopyFiles("**/*", authWebSolidSrc, webAppDir, context);
-			} else {
 			}
 		}
 	}
@@ -495,7 +576,7 @@ export async function setupAuthTemplate(
 	if (hasNative && nativeAppDirExists) {
 		const authNativeBaseSrc = path.join(
 			PKG_ROOT,
-			"templates/auth/native/native-base",
+			`templates/auth/${authProvider}/native/native-base`,
 		);
 		if (await fs.pathExists(authNativeBaseSrc)) {
 			await processAndCopyFiles(
@@ -516,7 +597,7 @@ export async function setupAuthTemplate(
 		if (nativeFrameworkAuthPath) {
 			const authNativeFrameworkSrc = path.join(
 				PKG_ROOT,
-				`templates/auth/native/${nativeFrameworkAuthPath}`,
+				`templates/auth/${authProvider}/native/${nativeFrameworkAuthPath}`,
 			);
 			if (await fs.pathExists(authNativeFrameworkSrc)) {
 				await processAndCopyFiles(

apps/cli/src/index.ts

@@ -12,6 +12,7 @@ import {
 	AddonsSchema,
 	type API,
 	APISchema,
+	AuthSchema,
 	type Backend,
 	BackendSchema,
 	type BetterTStackConfig,
@@ -78,7 +79,7 @@ export const router = t.router({
 						.describe("Show detailed result information"),
 					database: DatabaseSchema.optional(),
 					orm: ORMSchema.optional(),
-					auth: z.boolean().optional(),
+					auth: AuthSchema.optional(),
 					frontend: z.array(FrontendSchema).optional(),
 					addons: z.array(AddonsSchema).optional(),
 					examples: z.array(ExamplesSchema).optional(),
@@ -202,7 +203,7 @@ export function createBtsCli() {
  *   backend: "hono",
  *   database: "sqlite",
  *   orm: "drizzle",
- *   auth: true,
+ *   auth: "better-auth",
  *   addons: ["biome", "turborepo"],
  *   packageManager: "bun",
  *   install: false,

apps/cli/src/prompts/auth.ts

@@ -1,27 +1,56 @@
-import { confirm, isCancel } from "@clack/prompts";
+import { isCancel, select } from "@clack/prompts";
 import { DEFAULT_CONFIG } from "../constants";
-import type { Backend } from "../types";
+import type { Auth, Backend } from "../types";
 import { exitCancelled } from "../utils/errors";
 
 export async function getAuthChoice(
-	auth: boolean | undefined,
+	auth: Auth | undefined,
 	hasDatabase: boolean,
 	backend?: Backend,
+	frontend?: string[],
 ) {
+	if (auth !== undefined) return auth;
 	if (backend === "convex") {
-		return false;
+		const unsupportedFrontends = frontend?.filter((f) =>
+			["nuxt", "svelte", "solid"].includes(f),
+		);
+
+		if (unsupportedFrontends && unsupportedFrontends.length > 0) {
+			return "none";
+		}
+
+		const response = await select({
+			message: "Select authentication provider",
+			options: [
+				{
+					value: "clerk",
+					label: "Clerk",
+					hint: "More than auth, Complete User Management",
+				},
+				{ value: "none", label: "None" },
+			],
+			initialValue: "clerk",
+		});
+		if (isCancel(response)) return exitCancelled("Operation cancelled");
+		return response as Auth;
 	}
 
-	if (!hasDatabase) return false;
+	if (!hasDatabase) return "none";
 
-	if (auth !== undefined) return auth;
-
-	const response = await confirm({
-		message: "Add authentication with Better-Auth?",
+	const response = await select({
+		message: "Select authentication provider",
+		options: [
+			{
+				value: "better-auth",
+				label: "Better-Auth",
+				hint: "comprehensive auth framework for TypeScript",
+			},
+			{ value: "none", label: "None" },
+		],
 		initialValue: DEFAULT_CONFIG.auth,
 	});
 
 	if (isCancel(response)) return exitCancelled("Operation cancelled");
 
-	return response;
+	return response as Auth;
 }

apps/cli/src/prompts/config-prompts.ts

@@ -2,6 +2,7 @@ import { group } from "@clack/prompts";
 import type {
 	Addons,
 	API,
+	Auth,
 	Backend,
 	Database,
 	DatabaseSetup,
@@ -38,7 +39,7 @@ type PromptGroupResults = {
 	database: Database;
 	orm: ORM;
 	api: API;
-	auth: boolean;
+	auth: Auth;
 	addons: Addons[];
 	examples: Examples[];
 	dbSetup: DatabaseSetup;
@@ -57,7 +58,8 @@ export async function gatherConfig(
 ): Promise<ProjectConfig> {
 	const result = await group<PromptGroupResults>(
 		{
-			frontend: () => getFrontendChoice(flags.frontend, flags.backend),
+			frontend: () =>
+				getFrontendChoice(flags.frontend, flags.backend, flags.auth),
 			backend: ({ results }) =>
 				getBackendFrameworkChoice(flags.backend, results.frontend),
 			runtime: ({ results }) =>
@@ -75,7 +77,12 @@ export async function gatherConfig(
 			api: ({ results }) =>
 				getApiChoice(flags.api, results.frontend, results.backend),
 			auth: ({ results }) =>
-				getAuthChoice(flags.auth, results.database !== "none", results.backend),
+				getAuthChoice(
+					flags.auth as import("../types").Auth | undefined,
+					results.database !== "none",
+					results.backend,
+					results.frontend,
+				),
 			addons: ({ results }) => getAddonsChoice(flags.addons, results.frontend),
 			examples: ({ results }) =>
 				getExamplesChoice(
@@ -121,7 +128,6 @@ export async function gatherConfig(
 		result.database = "none";
 		result.orm = "none";
 		result.api = "none";
-		result.auth = false;
 		result.dbSetup = "none";
 		result.examples = ["todo"];
 	}
@@ -131,7 +137,7 @@ export async function gatherConfig(
 		result.database = "none";
 		result.orm = "none";
 		result.api = "none";
-		result.auth = false;
+		result.auth = "none";
 		result.dbSetup = "none";
 		result.examples = [];
 	}

apps/cli/src/prompts/frontend.ts

@@ -7,6 +7,7 @@ import { exitCancelled } from "../utils/errors";
 export async function getFrontendChoice(
 	frontendOptions?: Frontend[],
 	backend?: Backend,
+	auth?: string,
 ): Promise<Frontend[]> {
 	if (frontendOptions !== undefined) return frontendOptions;
 
@@ -72,7 +73,7 @@ export async function getFrontendChoice(
 		];
 
 		const webOptions = allWebOptions.filter((option) =>
-			isFrontendAllowedWithBackend(option.value, backend),
+			isFrontendAllowedWithBackend(option.value, backend, auth),
 		);
 
 		const webFramework = await select<Frontend>({

apps/cli/src/types.ts

@@ -80,6 +80,11 @@ export type DatabaseSetup = z.infer<typeof DatabaseSetupSchema>;
 export const APISchema = z.enum(["trpc", "orpc", "none"]).describe("API type");
 export type API = z.infer<typeof APISchema>;
 
+export const AuthSchema = z
+	.enum(["better-auth", "clerk", "none"])
+	.describe("Authentication provider");
+export type Auth = z.infer<typeof AuthSchema>;
+
 export const ProjectNameSchema = z
 	.string()
 	.min(1, "Project name cannot be empty")
@@ -125,7 +130,7 @@ export type CreateInput = {
 	verbose?: boolean;
 	database?: Database;
 	orm?: ORM;
-	auth?: boolean;
+	auth?: Auth;
 	frontend?: Frontend[];
 	addons?: Addons[];
 	examples?: Examples[];
@@ -167,7 +172,7 @@ export interface ProjectConfig {
 	frontend: Frontend[];
 	addons: Addons[];
 	examples: Examples[];
-	auth: boolean;
+	auth: Auth;
 	git: boolean;
 	packageManager: PackageManager;
 	install: boolean;
@@ -187,7 +192,7 @@ export interface BetterTStackConfig {
 	frontend: Frontend[];
 	addons: Addons[];
 	examples: Examples[];
-	auth: boolean;
+	auth: Auth;
 	packageManager: PackageManager;
 	dbSetup: DatabaseSetup;
 	api: API;

apps/cli/src/utils/compatibility-rules.ts

@@ -135,7 +135,6 @@ export function validateWorkersCompatibility(
 
 export function coerceBackendPresets(config: Partial<ProjectConfig>) {
 	if (config.backend === "convex") {
-		config.auth = false;
 		config.database = "none";
 		config.orm = "none";
 		config.api = "none";
@@ -144,7 +143,7 @@ export function coerceBackendPresets(config: Partial<ProjectConfig>) {
 		config.examples = ["todo"] as ProjectConfig["examples"];
 	}
 	if (config.backend === "none") {
-		config.auth = false;
+		config.auth = "none" as ProjectConfig["auth"];
 		config.database = "none";
 		config.orm = "none";
 		config.api = "none";
@@ -161,7 +160,13 @@ export function incompatibleFlagsForBackend(
 ): string[] {
 	const list: string[] = [];
 	if (backend === "convex") {
-		if (providedFlags.has("auth") && options.auth === true) list.push("--auth");
+		if (
+			providedFlags.has("auth") &&
+			options.auth &&
+			options.auth !== "none" &&
+			options.auth !== "clerk"
+		)
+			list.push(`--auth ${options.auth}`);
 		if (providedFlags.has("database") && options.database !== "none")
 			list.push(`--database ${options.database}`);
 		if (providedFlags.has("orm") && options.orm !== "none")
@@ -174,7 +179,8 @@ export function incompatibleFlagsForBackend(
 			list.push(`--db-setup ${options.dbSetup}`);
 	}
 	if (backend === "none") {
-		if (providedFlags.has("auth") && options.auth === true) list.push("--auth");
+		if (providedFlags.has("auth") && options.auth && options.auth !== "none")
+			list.push(`--auth ${options.auth}`);
 		if (providedFlags.has("database") && options.database !== "none")
 			list.push(`--database ${options.database}`);
 		if (providedFlags.has("orm") && options.orm !== "none")
@@ -210,8 +216,15 @@ export function validateApiFrontendCompatibility(
 export function isFrontendAllowedWithBackend(
 	frontend: Frontend,
 	backend?: ProjectConfig["backend"],
+	auth?: string,
 ) {
 	if (backend === "convex" && frontend === "solid") return false;
+
+	if (auth === "clerk" && backend === "convex") {
+		const incompatibleFrontends = ["nuxt", "svelte", "solid"];
+		if (incompatibleFrontends.includes(frontend)) return false;
+	}
+
 	return true;
 }
 

apps/cli/src/utils/config-processing.ts

@@ -1,6 +1,7 @@
 import path from "node:path";
 import type {
 	API,
+	Auth,
 	Backend,
 	CLIInput,
 	Database,
@@ -57,7 +58,7 @@ export function processFlags(
 	}
 
 	if (options.auth !== undefined) {
-		config.auth = options.auth;
+		config.auth = options.auth as Auth;
 	}
 
 	if (options.git !== undefined) {

apps/cli/src/utils/config-validation.ts

@@ -66,15 +66,21 @@ export function validateDatabaseOrmAuth(
 		);
 	}
 
-	if (has("auth") && has("database") && cfg.auth && db === "none") {
+	if (
+		has("auth") &&
+		has("database") &&
+		cfg.auth !== "none" &&
+		db === "none" &&
+		cfg.backend !== "convex"
+	) {
 		exitWithError(
-			"Authentication requires a database. Please choose a database or set '--no-auth'.",
+			"Authentication requires a database. Please choose a database or set '--auth none'.",
 		);
 	}
 
-	if (cfg.auth && db === "none") {
+	if (cfg.auth !== "none" && db === "none" && cfg.backend !== "convex") {
 		exitWithError(
-			"Authentication requires a database. Please choose a database or set '--no-auth'.",
+			"Authentication requires a database. Please choose a database or set '--auth none'.",
 		);
 	}
 
@@ -178,6 +184,35 @@ export function validateBackendConstraints(
 ): void {
 	const { backend } = config;
 
+	if (config.auth === "clerk" && backend !== "convex") {
+		exitWithError(
+			"Clerk authentication is only supported with the Convex backend. Please use '--backend convex' or choose a different auth provider.",
+		);
+	}
+
+	if (backend === "convex" && config.auth === "clerk" && config.frontend) {
+		const incompatibleFrontends = config.frontend.filter((f) =>
+			["nuxt", "svelte", "solid"].includes(f),
+		);
+		if (incompatibleFrontends.length > 0) {
+			exitWithError(
+				`Clerk authentication is not compatible with the following frontends: ${incompatibleFrontends.join(
+					", ",
+				)}. Please choose a different frontend or auth provider.`,
+			);
+		}
+	}
+
+	if (
+		backend === "convex" &&
+		config.auth === "better-auth" &&
+		providedFlags.has("auth")
+	) {
+		exitWithError(
+			"Better-Auth is not compatible with the Convex backend. Please use '--auth clerk' or '--auth none'.",
+		);
+	}
+
 	if (
 		providedFlags.has("backend") &&
 		backend &&

apps/cli/src/utils/display-config.ts

@@ -40,13 +40,7 @@ export function displayConfig(config: Partial<ProjectConfig>) {
 	}
 
 	if (config.auth !== undefined) {
-		const authText =
-			typeof config.auth === "boolean"
-				? config.auth
-					? "Yes"
-					: "No"
-				: String(config.auth);
-		configDisplay.push(`${pc.blue("Authentication:")} ${authText}`);
+		configDisplay.push(`${pc.blue("Auth:")} ${String(config.auth)}`);
 	}
 
 	if (config.addons !== undefined) {

apps/cli/src/utils/generate-reproducible-command.ts

@@ -14,7 +14,7 @@ export function generateReproducibleCommand(config: ProjectConfig): string {
 	flags.push(`--database ${config.database}`);
 	flags.push(`--orm ${config.orm}`);
 	flags.push(`--api ${config.api}`);
-	flags.push(config.auth ? "--auth" : "--no-auth");
+	flags.push(`--auth ${config.auth}`);
 
 	if (config.addons && config.addons.length > 0) {
 		flags.push(`--addons ${config.addons.join(" ")}`);

apps/cli/templates/addons/ruler/.ruler/bts.md.hbs

@@ -77,7 +77,7 @@ Database models are located in `apps/server/src/db/models/`
 {{/if}}
 {{/if}}
 
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 ## Authentication
 
 Authentication is enabled in this project:

apps/cli/templates/api/orpc/native/utils/orpc.ts.hbs

@@ -3,7 +3,7 @@ import { RPCLink } from "@orpc/client/fetch";
 import { createTanstackQueryUtils } from "@orpc/tanstack-query";
 import { QueryCache, QueryClient } from "@tanstack/react-query";
 import type { AppRouterClient } from "../../server/src/routers";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { authClient } from "@/lib/auth-client";
 {{/if}}
 
@@ -17,7 +17,7 @@ export const queryClient = new QueryClient({
 
 export const link = new RPCLink({
   url: `${process.env.EXPO_PUBLIC_SERVER_URL}/rpc`,
-  {{#if auth}}
+  {{#if (eq auth "better-auth")}}
   headers() {
     const headers = new Map<string, string>();
     const cookies = authClient.getCookie();

apps/cli/templates/api/orpc/server/base/src/lib/context.ts.hbs

@@ -1,11 +1,11 @@
 {{#if (eq backend 'next')}}
 import type { NextRequest } from "next/server";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { auth } from "./auth";
 {{/if}}
 
 export async function createContext(req: NextRequest) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: req.headers,
   });
@@ -19,7 +19,7 @@ export async function createContext(req: NextRequest) {
 
 {{else if (eq backend 'hono')}}
 import type { Context as HonoContext } from "hono";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { auth } from "./auth";
 {{/if}}
 
@@ -28,7 +28,7 @@ export type CreateContextOptions = {
 };
 
 export async function createContext({ context }: CreateContextOptions) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: context.req.raw.headers,
   });
@@ -45,7 +45,7 @@ export async function createContext({ context }: CreateContextOptions) {
 
 {{else if (eq backend 'elysia')}}
 import type { Context as ElysiaContext } from "elysia";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { auth } from "./auth";
 {{/if}}
 
@@ -54,7 +54,7 @@ export type CreateContextOptions = {
 };
 
 export async function createContext({ context }: CreateContextOptions) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: context.request.headers,
   });
@@ -70,13 +70,13 @@ export async function createContext({ context }: CreateContextOptions) {
 }
 
 {{else if (eq backend 'express')}}
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { fromNodeHeaders } from "better-auth/node";
 import { auth } from "./auth";
 {{/if}}
 
 export async function createContext(opts: any) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 	const session = await auth.api.getSession({
 		headers: fromNodeHeaders(opts.req.headers),
 	});
@@ -93,13 +93,13 @@ export async function createContext(opts: any) {
 
 {{else if (eq backend 'fastify')}}
 import type { IncomingHttpHeaders } from "node:http";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { fromNodeHeaders } from "better-auth/node";
 import { auth } from "./auth";
 {{/if}}
 
 export async function createContext(req: IncomingHttpHeaders) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: fromNodeHeaders(req),
   });

apps/cli/templates/api/orpc/server/base/src/lib/orpc.ts.hbs

@@ -5,7 +5,7 @@ export const o = os.$context<Context>();
 
 export const publicProcedure = o;
 
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 const requireAuth = o.middleware(async ({ context, next }) => {
   if (!context.session?.user) {
     throw new ORPCError("UNAUTHORIZED");

apps/cli/templates/api/orpc/server/next/src/app/rpc/[...all]/route.ts.hbs

@@ -1,4 +1,4 @@
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { createContext } from '@/lib/context'
 {{/if}}
 import { appRouter } from '@/routers'
@@ -10,7 +10,7 @@ const handler = new RPCHandler(appRouter)
 async function handleRequest(req: NextRequest) {
   const { response } = await handler.handle(req, {
     prefix: '/rpc',
-    context: {{#if auth}}await createContext(req){{else}}{}{{/if}},
+    context: {{#if (eq auth "better-auth")}}await createContext(req){{else}}{}{{/if}},
   })
 
   return response ?? new Response('Not found', { status: 404 })

apps/cli/templates/api/orpc/web/nuxt/app/plugins/orpc.ts.hbs

@@ -12,7 +12,7 @@ export default defineNuxtPlugin(() => {
 
   const rpcLink = new RPCLink({
     url: rpcUrl,
-    {{#if auth}}
+    {{#if (eq auth "better-auth")}}
     fetch(url, options) {
         return fetch(url, {
         ...options,

apps/cli/templates/api/orpc/web/react/base/src/utils/orpc.ts.hbs

@@ -26,7 +26,7 @@ export const link = new RPCLink({
   {{else}}
   url: `${import.meta.env.VITE_SERVER_URL}/rpc`,
   {{/if}}
-  {{#if auth}}
+  {{#if (eq auth "better-auth")}}
   fetch(url, options) {
     return fetch(url, {
       ...options,

apps/cli/templates/api/orpc/web/solid/src/utils/orpc.ts.hbs

@@ -14,7 +14,7 @@ export const queryClient = new QueryClient({
 
 export const link = new RPCLink({
   url: `${import.meta.env.VITE_SERVER_URL}/rpc`,
-  {{#if auth}}
+  {{#if (eq auth "better-auth")}}
   fetch(url, options) {
     return fetch(url, {
       ...options,

apps/cli/templates/api/orpc/web/svelte/src/lib/orpc.ts.hbs

@@ -15,7 +15,7 @@ export const queryClient = new QueryClient({
 
 export const link = new RPCLink({
 	url: `${PUBLIC_SERVER_URL}/rpc`,
-	{{#if auth}}
+	{{#if (eq auth "better-auth")}}
 	fetch(url, options) {
 		return fetch(url, {
 			...options,

apps/cli/templates/api/trpc/native/utils/trpc.ts.hbs

@@ -1,4 +1,4 @@
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { authClient } from "@/lib/auth-client";
 {{/if}}
 import { QueryClient } from "@tanstack/react-query";
@@ -12,7 +12,7 @@ const trpcClient = createTRPCClient<AppRouter>({
 	links: [
 		httpBatchLink({
 			url: `${process.env.EXPO_PUBLIC_SERVER_URL}/trpc`,
-			{{#if auth}}
+			{{#if (eq auth "better-auth")}}
 			headers() {
 				const headers = new Map<string, string>();
 				const cookies = authClient.getCookie();

apps/cli/templates/api/trpc/server/base/src/lib/context.ts.hbs

@@ -1,11 +1,11 @@
 {{#if (eq backend 'next')}}
 import type { NextRequest } from "next/server";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { auth } from "./auth";
 {{/if}}
 
 export async function createContext(req: NextRequest) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: req.headers,
   });
@@ -22,7 +22,7 @@ export async function createContext(req: NextRequest) {
 
 {{else if (eq backend 'hono')}}
 import type { Context as HonoContext } from "hono";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { auth } from "./auth";
 {{/if}}
 
@@ -31,7 +31,7 @@ export type CreateContextOptions = {
 };
 
 export async function createContext({ context }: CreateContextOptions) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: context.req.raw.headers,
   });
@@ -48,7 +48,7 @@ export async function createContext({ context }: CreateContextOptions) {
 
 {{else if (eq backend 'elysia')}}
 import type { Context as ElysiaContext } from "elysia";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { auth } from "./auth";
 {{/if}}
 
@@ -57,7 +57,7 @@ export type CreateContextOptions = {
 };
 
 export async function createContext({ context }: CreateContextOptions) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: context.request.headers,
   });
@@ -74,13 +74,13 @@ export async function createContext({ context }: CreateContextOptions) {
 
 {{else if (eq backend 'express')}}
 import type { CreateExpressContextOptions } from "@trpc/server/adapters/express";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { fromNodeHeaders } from "better-auth/node";
 import { auth } from "./auth";
 {{/if}}
 
 export async function createContext(opts: CreateExpressContextOptions) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 	const session = await auth.api.getSession({
 		headers: fromNodeHeaders(opts.req.headers),
 	});
@@ -97,13 +97,13 @@ export async function createContext(opts: CreateExpressContextOptions) {
 
 {{else if (eq backend 'fastify')}}
 import type { CreateFastifyContextOptions } from "@trpc/server/adapters/fastify";
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 import { fromNodeHeaders } from "better-auth/node";
 import { auth } from "./auth";
 {{/if}}
 
 export async function createContext({ req, res }: CreateFastifyContextOptions) {
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
   const session = await auth.api.getSession({
     headers: fromNodeHeaders(req.headers),
   });

apps/cli/templates/api/trpc/server/base/src/lib/trpc.ts.hbs

@@ -7,7 +7,7 @@ export const router = t.router;
 
 export const publicProcedure = t.procedure;
 
-{{#if auth}}
+{{#if (eq auth "better-auth")}}
 export const protectedProcedure = t.procedure.use(({ ctx, next }) => {
   if (!ctx.session) {
     throw new TRPCError({

apps/cli/templates/api/trpc/web/react/base/src/utils/trpc.ts.hbs

@@ -28,7 +28,7 @@ const trpcClient = createTRPCClient<AppRouter>({
       {{else}}
       url: `${import.meta.env.VITE_SERVER_URL}/trpc`,
       {{/if}}
-      {{#if auth}}
+      {{#if (eq auth "better-auth")}}
       fetch(url, options) {
         return fetch(url, {
           ...options,
@@ -78,7 +78,7 @@ export const trpcClient = createTRPCClient<AppRouter>({
   links: [
     httpBatchLink({
       url: `${import.meta.env.VITE_SERVER_URL}/trpc`,
-      {{#if auth}}
+      {{#if (eq auth "better-auth")}}
       fetch(url, options) {
         return fetch(url, {
           ...options,

apps/cli/templates/auth/clerk/convex/backend/convex/auth.config.ts.hbs

@@ -0,0 +1,12 @@
+export default {
+	providers: [
+		{
+			// Replace with your own Clerk Issuer URL from your "convex" JWT template
+			// or with `process.env.CLERK_JWT_ISSUER_DOMAIN`
+			// and configure CLERK_JWT_ISSUER_DOMAIN on the Convex Dashboard
+			// See https://docs.convex.dev/auth/clerk#configuring-dev-and-prod-instances
+			domain: process.env.CLERK_JWT_ISSUER_DOMAIN,
+			applicationID: "convex",
+		},
+	],
+};

apps/cli/templates/auth/clerk/convex/backend/convex/privateData.ts.hbs

@@ -0,0 +1,16 @@
+import { query } from "./_generated/server";
+
+export const get = query({
+	args: {},
+	handler: async (ctx) => {
+		const identity = await ctx.auth.getUserIdentity();
+		if (identity === null) {
+			return {
+				message: "Not authenticated",
+			};
+		}
+		return {
+			message: "This is private",
+		};
+	},
+});

apps/cli/templates/auth/clerk/convex/native/base/app/(auth)/_layout.tsx.hbs

@@ -0,0 +1,12 @@
+import { Redirect, Stack } from "expo-router";
+import { useAuth } from "@clerk/clerk-expo";
+
+export default function AuthRoutesLayout() {
+  const { isSignedIn } = useAuth();
+
+  if (isSignedIn) {
+    return <Redirect href={"/"} />;
+  }
+
+  return <Stack />;
+}

apps/cli/templates/auth/clerk/convex/native/base/app/(auth)/sign-in.tsx.hbs

@@ -0,0 +1,67 @@
+import { useSignIn } from "@clerk/clerk-expo";
+import { Link, useRouter } from "expo-router";
+import { Text, TextInput, TouchableOpacity, View } from "react-native";
+import React from "react";
+
+export default function Page() {
+  const { signIn, setActive, isLoaded } = useSignIn();
+  const router = useRouter();
+
+  const [emailAddress, setEmailAddress] = React.useState("");
+  const [password, setPassword] = React.useState("");
+
+  // Handle the submission of the sign-in form
+  const onSignInPress = async () => {
+    if (!isLoaded) return;
+
+    // Start the sign-in process using the email and password provided
+    try {
+      const signInAttempt = await signIn.create({
+        identifier: emailAddress,
+        password,
+      });
+
+      // If sign-in process is complete, set the created session as active
+      // and redirect the user
+      if (signInAttempt.status === "complete") {
+        await setActive({ session: signInAttempt.createdSessionId });
+        router.replace("/");
+      } else {
+        // If the status isn't complete, check why. User might need to
+        // complete further steps.
+        console.error(JSON.stringify(signInAttempt, null, 2));
+      }
+    } catch (err) {
+      // See https://clerk.com/docs/custom-flows/error-handling
+      // for more info on error handling
+      console.error(JSON.stringify(err, null, 2));
+    }
+  };
+
+  return (
+    <View>
+      <Text>Sign in</Text>
+      <TextInput
+        autoCapitalize="none"
+        value={emailAddress}
+        placeholder="Enter email"
+        onChangeText={(emailAddress) => setEmailAddress(emailAddress)}
+      />
+      <TextInput
+        value={password}
+        placeholder="Enter password"
+        secureTextEntry={true}
+        onChangeText={(password) => setPassword(password)}
+      />
+      <TouchableOpacity onPress={onSignInPress}>
+        <Text>Continue</Text>
+      </TouchableOpacity>
+      <View style=\{{ display: "flex", flexDirection: "row", gap: 3 }}>
+        <Text>Don't have an account?</Text>
+        <Link href="/sign-up">
+          <Text>Sign up</Text>
+        </Link>
+      </View>
+    </View>
+  );
+}

apps/cli/templates/auth/clerk/convex/native/base/app/(auth)/sign-out.tsx.hbs

@@ -0,0 +1,110 @@
+import * as React from "react";
+import { Text, TextInput, TouchableOpacity, View } from "react-native";
+import { useSignUp } from "@clerk/clerk-expo";
+import { Link, useRouter } from "expo-router";
+
+export default function SignUpScreen() {
+  const { isLoaded, signUp, setActive } = useSignUp();
+  const router = useRouter();
+
+  const [emailAddress, setEmailAddress] = React.useState("");
+  const [password, setPassword] = React.useState("");
+  const [pendingVerification, setPendingVerification] = React.useState(false);
+  const [code, setCode] = React.useState("");
+
+  // Handle submission of sign-up form
+  const onSignUpPress = async () => {
+    if (!isLoaded) return;
+
+    console.log(emailAddress, password);
+
+    // Start sign-up process using email and password provided
+    try {
+      await signUp.create({
+        emailAddress,
+        password,
+      });
+
+      // Send user an email with verification code
+      await signUp.prepareEmailAddressVerification({ strategy: "email_code" });
+
+      // Set 'pendingVerification' to true to display second form
+      // and capture OTP code
+      setPendingVerification(true);
+    } catch (err) {
+      // See https://clerk.com/docs/custom-flows/error-handling
+      // for more info on error handling
+      console.error(JSON.stringify(err, null, 2));
+    }
+  };
+
+  // Handle submission of verification form
+  const onVerifyPress = async () => {
+    if (!isLoaded) return;
+
+    try {
+      // Use the code the user provided to attempt verification
+      const signUpAttempt = await signUp.attemptEmailAddressVerification({
+        code,
+      });
+
+      // If verification was completed, set the session to active
+      // and redirect the user
+      if (signUpAttempt.status === "complete") {
+        await setActive({ session: signUpAttempt.createdSessionId });
+        router.replace("/");
+      } else {
+        // If the status is not complete, check why. User may need to
+        // complete further steps.
+        console.error(JSON.stringify(signUpAttempt, null, 2));
+      }
+    } catch (err) {
+      // See https://clerk.com/docs/custom-flows/error-handling
+      // for more info on error handling
+      console.error(JSON.stringify(err, null, 2));
+    }
+  };
+
+  if (pendingVerification) {
+    return (
+      <>
+        <Text>Verify your email</Text>
+        <TextInput
+          value={code}
+          placeholder="Enter your verification code"
+          onChangeText={(code) => setCode(code)}
+        />
+        <TouchableOpacity onPress={onVerifyPress}>
+          <Text>Verify</Text>
+        </TouchableOpacity>
+      </>
+    );
+  }
+
+  return (
+    <View>
+      <Text>Sign up</Text>
+      <TextInput
+        autoCapitalize="none"
+        value={emailAddress}
+        placeholder="Enter email"
+        onChangeText={(email) => setEmailAddress(email)}
+      />
+      <TextInput
+        value={password}
+        placeholder="Enter password"
+        secureTextEntry={true}
+        onChangeText={(password) => setPassword(password)}
+      />
+      <TouchableOpacity onPress={onSignUpPress}>
+        <Text>Continue</Text>
+      </TouchableOpacity>
+      <View style=\{{ display: "flex", flexDirection: "row", gap: 3 }}>
+        <Text>Already have an account?</Text>
+        <Link href="/sign-in">
+          <Text>Sign in</Text>
+        </Link>
+      </View>
+    </View>
+  );
+}

apps/cli/templates/auth/clerk/convex/native/base/components/sign-out-button.tsx.hbs

@@ -0,0 +1,27 @@
+import { useClerk } from "@clerk/clerk-expo";
+import { useRouter } from "expo-router";
+import { Text, TouchableOpacity } from "react-native";
+
+export const SignOutButton = () => {
+  // Use `useClerk()` to access the `signOut()` function
+  const { signOut } = useClerk();
+  const router = useRouter();
+
+  const handleSignOut = async () => {
+    try {
+      await signOut();
+      // Redirect to your desired page
+      router.replace("/");
+    } catch (err) {
+      // See https://clerk.com/docs/custom-flows/error-handling
+      // for more info on error handling
+      console.error(JSON.stringify(err, null, 2));
+    }
+  };
+
+  return (
+    <TouchableOpacity onPress={handleSignOut}>
+      <Text>Sign out</Text>
+    </TouchableOpacity>
+  );
+};

apps/cli/templates/auth/clerk/convex/web/react/next/src/app/dashboard/page.tsx.hbs

@@ -0,0 +1,29 @@
+"use client";
+
+import { api } from "@{{projectName}}/backend/convex/_generated/api";
+import { SignInButton, UserButton, useUser } from "@clerk/nextjs";
+import { Authenticated, AuthLoading, Unauthenticated, useQuery } from "convex/react";
+
+export default function Dashboard() {
+  const user = useUser();
+  const privateData = useQuery(api.privateData.get);
+
+  return (
+    <>
+      <Authenticated>
+        <div>
+          <h1>Dashboard</h1>
+          <p>Welcome {user.user?.fullName}</p>
+          <p>privateData: {privateData?.message}</p>
+          <UserButton />
+        </div>
+      </Authenticated>
+      <Unauthenticated>
+        <SignInButton />
+      </Unauthenticated>
+      <AuthLoading>
+        <div>Loading...</div>
+      </AuthLoading>
+    </>
+  );
+}

apps/cli/templates/auth/clerk/convex/web/react/next/src/middleware.ts.hbs

@@ -0,0 +1,12 @@
+import { clerkMiddleware } from "@clerk/nextjs/server";
+
+export default clerkMiddleware();
+
+export const config = {
+	matcher: [
+		// Skip Next.js internals and all static files, unless found in search params
+		"/((?!_next|[^?]*\\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).*)",
+		// Always run for API routes
+		"/(api|trpc)(.*)",
+	],
+};

apps/cli/templates/auth/clerk/convex/web/react/react-router/src/routes/dashboard.tsx.hbs

@@ -0,0 +1,32 @@
+import { SignInButton, UserButton, useUser } from "@clerk/clerk-react";
+import { api } from "@{{projectName}}/backend/convex/_generated/api";
+import {
+	Authenticated,
+	AuthLoading,
+	Unauthenticated,
+	useQuery,
+} from "convex/react";
+
+export default function Dashboard() {
+	const privateData = useQuery(api.privateData.get);
+	const user = useUser();
+
+	return (
+		<>
+			<Authenticated>
+				<div>
+					<h1>Dashboard</h1>
+					<p>Welcome {user.user?.fullName}</p>
+					<p>privateData: {privateData?.message}</p>
+					<UserButton />
+				</div>
+			</Authenticated>
+			<Unauthenticated>
+				<SignInButton />
+			</Unauthenticated>
+			<AuthLoading>
+				<div>Loading...</div>
+			</AuthLoading>
+		</>
+	);
+}