Files

T

fargo 1a822493ba format: apply repo prettier (3.8.1) to the folded skills tree

963 markdown files reformatted with the repository's pinned prettier so
pnpm format:check covers the folded tree like every other repo file.

The formatter's embedded-language pass also normalized code fences
(TS semicolons, closed HTML tags in examples, lowercased CSS hex colors,
one renumbered list that skipped an index). Alphanumeric token deltas vs
the fold commit were audited file-by-file; all are formatter-equivalent
markup normalizations plus the four sanitized skills.

2026-08-19 14:37:17 -05:00

1.5 KiB

Raw Blame History

Directives

React Directives

These are React directives, not Next.js specific.

`'use client'`

Marks a component as a Client Component. Required for:

React hooks (useState, useEffect, etc.)
Event handlers (onClick, onChange)
Browser APIs (window, localStorage)

'use client';

import { useState } from 'react';

export function Counter() {
  const [count, setCount] = useState(0);
  return <button onClick={() => setCount(count + 1)}>{count}</button>;
}

Reference: https://react.dev/reference/rsc/use-client

`'use server'`

Marks a function as a Server Action. Can be passed to Client Components.

'use server';

export async function submitForm(formData: FormData) {
  // Runs on server
}

Or inline within a Server Component:

export default function Page() {
  async function submit() {
    'use server';
    // Runs on server
  }
  return <form action={submit}>...</form>;
}

Reference: https://react.dev/reference/rsc/use-server

Next.js Directive

`'use cache'`

Marks a function or component for caching. Part of Next.js Cache Components.

'use cache';

export async function getCachedData() {
  return await fetchData();
}

Requires cacheComponents: true in next.config.ts.

For detailed usage including cache profiles, cacheLife(), cacheTag(), and updateTag(), see the next-cache-components skill.

Reference: https://nextjs.org/docs/app/api-reference/directives/use-cache

1.5 KiB Raw Blame History