Vovy creates a Clerk app, drops its prebuilt sign in and user profile components into your code, and protects your private routes.
Set up Clerk so my app has sign in and user profiles
How it works
- Create the Clerk application: Vovy creates an app in the Clerk Dashboard and picks sign-in options with you: email, Google, GitHub, or others.
- Add the keys to .env: It copies the publishable key, which starts with pk_test_, and the secret key into .env.local, and confirms .env files are ignored by Git.
- Install Clerk and wrap the app: In Cursor it installs the Clerk package, wraps your app in ClerkProvider, and adds SignInButton and UserButton to your header.
- Protect private routes: Vovy adds clerkMiddleware with a list of protected routes so logged-out visitors are sent to sign in.
- Sign up and show the user: It signs up a test user in Chrome and shows them in the Clerk Dashboard Users page, with a card on what Clerk handles for you.
What you provide
- A Clerk account
- Your app open in Cursor
What you get
- Prebuilt sign in and profile screens
- Protected routes
- Keys stored in .env.local
- A test user in Clerk
FAQ
Clerk or Supabase Auth?
Clerk gives you polished screens, user profiles and organizations fast. Supabase Auth is built into your database. Many apps use Clerk with Supabase together.
What does Clerk cost?
Clerk has a free plan for small apps, with paid plans once you grow or need extras. Check clerk.com/pricing for the current limits.
Is this ready for real users?
This sets up the development instance. Going live needs a production instance with your own domain and OAuth keys, which is a separate step.
Related tasks
All tasks