nextjs-client-cookie-pattern

Community

Client ⟷ server cookie pattern

AuthorMuhammedSuhaib
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This pattern demonstrates how a client component can trigger a server action to set cookies, ensuring cookies are managed securely on the server side while enabling client-side interactivity.

Core Features & Use Cases

  • Two-file pattern: Client component + server action for cookie management.
  • Secure cookies: Server-side control of cookies with proper attributes.
  • Real-world examples: Theme toggles, cookies banners, and language preferences.

Quick Start

  1. Create a client component with 'use client' and an onClick handler.
  2. Implement a server action using next/headers' cookies() to set the cookie.
  3. Call the server action from the client component.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: nextjs-client-cookie-pattern
Download link: https://github.com/MuhammedSuhaib/LevelUpSpeckit-Plus/archive/main.zip#nextjs-client-cookie-pattern

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository