`useState` is a Client Component hook. Keep the component server-side if it only renders fetched data; move the interactive state into a small child with `'use client'` and pass it serializable initial data. For form or mutation feedback, use a Client Component with `useActionState`, `useFormStatus`, or `useOptimistic` while keeping the Server Action secure.
Installs into .claude/skills of the current project.
Are you the author of Nextjs Server Components?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/hoangnguyen0403-nextjs-server-components-e09b4507)
`useState` is a Client Component hook. Keep the component server-side if it only renders fetched data; move the interactive state into a small child with `'use client'` and pass it serializable initial data. For form or mutation feedback, use a Client Component with `useActionState`, `useFormStatus`, or `useOptimistic` while keeping the Server Action secure.