skills.rest
Jawad-Chaudhary
Jawad-ChaudharyCOMMUNITY
Explore all skills by this author →
GitHub

api-fetch-with-auth

Create an authenticated fetch utility for Next.js using better-auth tokens.

Updated Dec 31, 2025
Search Tags:#api#fetch#nextjs#http#session#token#authenticate
One-click install
npx skills add https://github.com/Jawad-Chaudhary/Hackathone-2-TODO-Spec-Driven-Development --skill api-fetch-with-auth
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: api-fetch-with-auth
Source: https://github.com/Jawad-Chaudhary/Hackathone-2-TODO-Spec-Driven-Development/tree/main/Phase02/.claude/skills/api-fetch-with-auth
Command: npx skills add https://github.com/Jawad-Chaudhary/Hackathone-2-TODO-Spec-Driven-Development --skill api-fetch-with-auth

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill simplifies making authenticated API requests from a Next.js frontend by automatically attaching the user's Bearer token to requests, reducing boilerplate and potential errors.

Core Features & Use Cases

  • Reusable fetch function: apiFetch(url, method, body) that automatically includes the Authorization header.
  • Token handling: retrieves the token from getSession and uses it for all calls.
  • Use Case: fetch data from protected endpoints in a Next.js application.

Quick Start

Create the apiFetch function by importing getSession from better-auth/nextjs and using it to attach the Bearer token to the Authorization header for the request.

Frequently Asked Questions about api-fetch-with-auth

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

FAQPage Schema
How do I automatically attach a Bearer token to fetch requests in a Next.js application?▼

To automatically attach a Bearer token to Next.js fetch requests, you can use a utility function that imports getSession from better-auth/nextjs and injects the token into the Authorization header.

What is the best way to fetch data from protected API endpoints using Next.js?▼

The best way to fetch data from protected endpoints in Next.js is using a reusable fetch wrapper that retrieves the session token and includes it in the Authorization header for every request.

How does getSession work with better-auth to authenticate API calls?▼

The getSession function from better-auth/nextjs retrieves the current user's session token, which is then applied to the Authorization header of your fetch options to authenticate API calls.

Can I use this authenticated fetch utility for different HTTP methods and request bodies?▼

Yes, the apiFetch utility accepts endpoint, method, and optional body parameters, allowing you to perform authenticated API calls with various HTTP methods in Next.js.

Do I need better-auth to manage session tokens for Next.js API fetch calls?▼

Yes, this specific utility requires better-auth/nextjs because it directly imports getSession to retrieve the session token needed for the Authorization header in fetch calls.

Related Skills

Explore More Software Engineering Skills→
syeda-hoorain-alisyeda-hoorain-ali

better-auth-implementation-for-nextjs-fastapi

Implement Better Auth and JWT authentication for Next.js and FastAPI applications.

Community
Advanced
orkestra-ccorkestra-cc
1

orkestra-api-test

Generate JWTs and test protected Orkestra API endpoints with curl and jq.

Official
Intermediate
reginadelrio-vadaireginadelrio-vadai

nextjs-supabase-auth

Integrate Supabase Auth with Next.js App Router using @supabase/ssr.

Community
Advanced
Gaku52Gaku52
6

nextjs-development

Build scalable Next.js apps with App Router and Server Components.

Community
Intermediate