playbooks

home / skills / andrelandgraf / fullstackrecipes / authentication

authentication skill

/skills/authentication

This skill implements a complete authentication system with Better Auth, email verification, and protected routes to secure user data.

npx playbooks add skill andrelandgraf/fullstackrecipes --skill authentication

Review the files below or copy the command above to add this skill to your agents.

Files (1)
SKILL.md
3.2 KB
---
name: authentication
description: Complete authentication system with Better Auth, email verification, password reset, protected routes, and account management.
---

# Authentication

Complete authentication system with Better Auth, email verification, password reset, protected routes, and account management.

## Prerequisites

Complete these recipes first (in order):

### Type-Safe Environment Configuration

Type-safe environment variable validation using Zod with a Drizzle-like schema API. Supports server/public fields, feature flags, either-or constraints, and client-side protection.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/config-schema-setup
```

### Neon + Drizzle Setup

Connect a Next.js app to Neon Postgres using Drizzle ORM with optimized connection pooling for Vercel serverless functions.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/neon-drizzle-setup
```

### Next.js on Vercel

Create a Next.js app running on Bun, configure the development environment, and deploy to Vercel with automatic deployments on push.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/nextjs-on-vercel
```

### Shadcn UI & Theming

Add Shadcn UI components with dark mode support using next-themes. Includes theme provider and CSS variables configuration.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/shadcn-ui-setup
```

## Cookbook - Complete These Recipes in Order

### Resend Setup

Configure Resend for transactional emails like password resets and email verification.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/resend-setup
```

### Better Auth Setup

Add user authentication using Better Auth with Drizzle ORM and Neon Postgres. Base setup with email/password authentication.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/better-auth-setup
```

### Better Auth Emails

Add email verification, password reset, and account management emails to Better Auth using Resend.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/better-auth-emails
```

### Better Auth Components

Add UI components and pages for authentication flows including sign in, sign up, forgot password, reset password, and email verification.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/better-auth-components
```

### Better Auth Profile & Account

Add a complete account settings page with profile editing, password changes, email updates, session management, and account deletion.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/better-auth-profile
```

### Better Auth Protected Routes

Add server-side route protection to enforce authentication on specific pages while keeping others public.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/better-auth-protected-routes
```

### Working with Authentication

Use Better Auth for client and server-side authentication. Covers session access, protected routes, sign in/out, and fetching user data.

```bash
curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/using-authentication
```

Overview

This skill provides a complete authentication system built with Better Auth, including email verification, password reset, protected routes, and full account management. It bundles production-ready patterns and step-by-step recipes for integrating authentication in TypeScript Next.js apps with Neon Postgres and Drizzle ORM. The recipes include transactional email setup, UI components, server and client authentication, and account settings flows.

How this skill works

Follow a sequence of recipes that wire up environment validation, database connection, and UI theming, then add Better Auth for user sessions and Resend for transactional emails. The system implements email verification and password reset flows, server-side route protection, and an account settings page that handles profile edits, password and email updates, session management, and account deletion. Each recipe is modular so you can adopt individual pieces or the full stack in order.

When to use it

  • Building a new full-stack Next.js app that requires secure sign-up, sign-in, and account management.
  • Adding email verification and password reset flows with production-ready transactional emails.
  • Protecting server-side routes while keeping public pages accessible.
  • Replacing a fragile custom auth system with a type-safe, maintainable solution.
  • Implementing session management and account deletion features for compliance or user control.

Best practices

  • Complete prerequisite recipes first: environment schema, database, and UI setup to avoid integration issues.
  • Use Resend for transactional emails and test templates in staging before sending to production.
  • Enforce server-side protected routes for any sensitive pages or API endpoints.
  • Keep environment variables validated and type-safe to prevent runtime surprises.
  • Rotate credentials and review session handling for long-lived tokens and logout behavior.

Example use cases

  • A SaaS app that requires email verification before allowing access to paid features.
  • A consumer web app that needs password reset emails and a self-serve account settings page.
  • An internal dashboard where some pages are public and others require authenticated access.
  • Migrating legacy auth to a modern stack with Drizzle ORM and Neon Postgres.
  • Rapid prototyping of authentication flows with prebuilt UI components and recipes.

FAQ

Do I need Resend to use this auth system?

Resend is recommended for production transactional emails, but you can swap in another email provider provided you wire the templates and delivery hooks.

Can I use a different database than Neon Postgres?

Drizzle ORM is database-agnostic in many setups, but the recipes target Neon Postgres; adapt the database connection recipe if you choose another provider.