auth-frontend-backend

Implements JWT-authenticated user-isolated API integration between Next.js frontend and FastAPI backend.

Updated Feb 8, 2026
One-click install
npx skills add https://github.com/ramshan00/hackaton --skill auth-frontend-backend-ramshan00
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: auth-frontend-backend
Source: https://github.com/ramshan00/hackaton/tree/main/Hackathon2-phase2/.claude/skills/auth-frontend-backend
Command: npx skills add https://github.com/ramshan00/hackaton --skill auth-frontend-backend-ramshan00

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires better-auth, slowapi, httpx, fastapi, pyjwt, and includes references (resource) components.

What problem does it solve? Connecting a Next.js frontend to a FastAPI backend with secure authentication is error-prone: developers must wire JWT token generation, verification, user data isolation, and rate limiting across two stacks. This Skill provides complete, working patterns for integrating Better Auth so every API call is authenticated and users can only access their own data. ## Core Features & Use Cases - JWT Authentication Flow: Generate JWT tokens via Better Auth on the frontend and verify them in FastAPI endpoints using dependency injection. - User Isolation: Enforce server-side data isolation so users can only read and modify their own records in database queries and API routes. - Rate Limiting: Apply IP-based and user-based rate limits with slowapi in FastAPI and middleware in Next.js, including tiered limits per user role. - Use Case: Build a task management app where each logged-in user sees only their own tasks, with all API calls carrying JWT tokens and abuse prevented by per-user rate limits. ## Quick Start Set up secure authentication between my Next.js 16 frontend and FastAPI backend using Better Auth with JWT tokens on every API call.

Frequently Asked Questions about auth-frontend-backend

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I connect a Next.js frontend to a FastAPI backend with JWT authentication?

Use Better Auth on the Next.js side to generate JWT tokens via authClient.jwt.generate(), then send them in the Authorization header. FastAPI verifies each token by calling Better Auth's session endpoint through an HTTPBearer dependency.

How to implement user data isolation in FastAPI endpoints?

Extract the authenticated user from the JWT token using a dependency, then filter all database queries by that user's ID. For updates or deletes, verify the record's user_id matches the authenticated user before modifying it.

How do I add rate limiting to FastAPI and Next.js APIs?

In FastAPI, use slowapi's Limiter with decorators like @limiter.limit("10/minute") on endpoints. In Next.js, apply rate limiting in middleware.ts using an in-memory map or Redis, keyed by IP address or user ID.

Does Better Auth support JWT tokens for external API calls?

Yes, Better Auth provides a jwt plugin for the server and a jwtClient plugin for the client. The client generates short-lived tokens that external backends like FastAPI can verify against Better Auth's session endpoint.

Why does my JWT token verification fail in FastAPI?

Verification fails when the token is expired, the Authorization header is malformed, or the Better Auth session endpoint rejects the token. Check that BETTER_AUTH_BASE_URL is correct and the token is sent as a Bearer credential.

What are the limitations of in-memory rate limiting in Next.js middleware?

In-memory rate limiters reset on server restarts and do not share state across multiple server instances or serverless invocations. For production deployments, use a Redis-backed rate limiter to maintain consistent counters.