### Example AGENTS.md File Structure and Content

Source: https://context7.com/agentsmd/agents.md/llms.txt

This Markdown snippet demonstrates the typical structure and content of an AGENTS.md file. It includes sections for setup commands, code style guidelines, development environment tips, testing instructions, and PR guidelines, providing clear instructions for AI coding agents.

```markdown
# AGENTS.md

## Setup commands
- Install deps: `pnpm install`
- Start dev server: `pnpm dev`
- Run tests: `pnpm test`

## Code style
- TypeScript strict mode
- Single quotes, no semicolons
- Use functional patterns where possible

## Dev environment tips
- Use `pnpm dlx turbo run where <project_name>` to jump to a package instead of scanning with `ls`.
- Run `pnpm install --filter <project_name>` to add the package to your workspace so Vite, ESLint, and TypeScript can see it.
- Check the name field inside each package's package.json to confirm the right name.

## Testing instructions
- Find the CI plan in the .github/workflows folder.
- Run `pnpm turbo run test --filter <project_name>` to run every check defined for that package.
- From the package root you can just call `pnpm test`. The commit should pass all tests before you merge.
- Fix any test or type errors until the whole suite is green.
- Add or update tests for the code you change, even if nobody asked.

## PR instructions
- Title format: [<project_name>] <Title>
- Always run `pnpm lint` and `pnpm test` before committing.

```

--------------------------------

### Run Next.js Website Locally (pnpm)

Source: https://context7.com/agentsmd/agents.md/llms.txt

This set of pnpm commands is used to run the AGENTS.md marketing website locally. It covers dependency installation, starting the development server with hot reloading, running lint checks, and building/starting the production server.

```bash
# Install dependencies
pnpm install

# Start the development server with hot reload
pnpm dev

# Open http://localhost:3000 in your browser

# Run ESLint checks
pnpm lint

# Production build (avoid during development sessions)
pnpm build

# Start production server
pnpm start

```

--------------------------------

### Monorepo Nested AGENTS.md Structure Example

Source: https://context7.com/agentsmd/agents.md/llms.txt

This example illustrates how AGENTS.md files can be nested within a monorepo structure. Placing AGENTS.md files in subdirectories allows for project-specific instructions, with the nearest file taking precedence for AI agents operating within that scope.

```directory structure
my-monorepo/
├── AGENTS.md              # Root-level instructions
├── packages/
│   ├── api/
│   │   └── AGENTS.md      # API-specific instructions
│   ├── web/
│   │   └── AGENTS.md      # Web app-specific instructions
│   └── shared/
│       └── AGENTS.md      # Shared library instructions

```

--------------------------------

### Running the Next.js Website Locally

Source: https://github.com/agentsmd/agents.md/blob/main/README.md

These commands are used to set up and run the Next.js development server for the AGENTS.md website. It requires Node.js and pnpm package manager.

```bash
pnpm install
pnpm run dev

```

--------------------------------

### AGENTS.md File Structure and Commands

Source: https://github.com/agentsmd/agents.md/blob/main/README.md

This snippet demonstrates the structure of a minimal AGENTS.md file, including sections for development environment tips, testing instructions, and pull request guidelines. It also shows common pnpm commands used within the project.

```markdown
# Sample AGENTS.md file

## Dev environment tips
- Use `pnpm dlx turbo run where <project_name>` to jump to a package instead of scanning with `ls`.
- Run `pnpm install --filter <project_name>` to add the package to your workspace so Vite, ESLint, and TypeScript can see it.
- Use `pnpm create vite@latest <project_name> -- --template react-ts` to spin up a new React + Vite package with TypeScript checks ready.
- Check the name field inside each package's package.json to confirm the right name—skip the top-level one.

## Testing instructions
- Find the CI plan in the .github/workflows folder.
- Run `pnpm turbo run test --filter <project_name>` to run every check defined for that package.
- From the package root you can just call `pnpm test`. The commit should pass all tests before you merge.
- To focus on one step, add the Vitest pattern: `pnpm vitest run -t "<test name>"`.
- Fix any test or type errors until the whole suite is green.
- After moving files or changing imports, run `pnpm lint --filter <project_name>` to be sure ESLint and TypeScript rules still pass.
- Add or update tests for the code you change, even if nobody asked.

## PR instructions
- Title format: [<project_name>] <Title>
- Always run `pnpm lint` and `pnpm test` before committing.

```

--------------------------------

### Configure Gemini CLI to Use AGENTS.md (JSON)

Source: https://context7.com/agentsmd/agents.md/llms.txt

This JSON configuration snippet demonstrates how to set up Google's Gemini CLI to utilize the `AGENTS.md` file. By specifying `"fileName": "AGENTS.md"` within the `context` object in `.gemini/settings.json`, Gemini CLI will incorporate the AGENTS.md content.

```json
{
  "context": {
    "fileName": "AGENTS.md"
  }
}

```

--------------------------------

### CodeExample Component with Copy-to-Clipboard (React/TSX)

Source: https://context7.com/agentsmd/agents.md/llms.txt

A React component that renders Markdown code blocks with syntax highlighting and a copy-to-clipboard button. It accepts code content, a URL, and layout options. Dependencies include React and browser Clipboard API.

```tsx
// components/CodeExample.tsx
import React from "react";

interface CodeExampleProps {
  code?: string;
  href?: string;
  compact?: boolean;
  heightClass?: string;
  centerVertically?: boolean;
}

export default function CodeExample({
  code,
  href,
  compact = false,
  heightClass,
  centerVertically = false,
}: CodeExampleProps) {
  const md = code ?? "# Default example content";
  const [copied, setCopied] = React.useState(false);

  const copyToClipboard = async () => {
    try {
      await navigator.clipboard.writeText(md);
      setCopied(true);
      setTimeout(() => setCopied(false), 2000);
    } catch (err) {
      console.error("Failed to copy to clipboard:", err);
    }
  };

  return (
    <div className="relative">
      <button
        onClick={copyToClipboard}
        className="absolute right-3 top-3 p-2 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800"
        aria-label="Copy to clipboard"
      >
        {copied ? "✓" : "Copy"}
      </button>
      <pre className="rounded-lg bg-white dark:bg-black text-xs leading-6 overflow-x-auto p-4 border border-gray-200 dark:border-gray-700">
        <code>{md}</code>
      </pre>
    </div>
  );
}

// Usage examples
<CodeExample compact />
<CodeExample code="npm install" heightClass="min-h-[48px]" centerVertically />
<CodeExample href="https://github.com/openai/codex/blob/main/AGENTS.md" />

```

--------------------------------

### Migrate AGENT.md to AGENTS.md with Symlink (Bash)

Source: https://context7.com/agentsmd/agents.md/llms.txt

This bash command demonstrates how to migrate an existing `AGENT.md` file to the `AGENTS.md` format and create a symbolic link for backward compatibility. This ensures that tools expecting the older filename can still access the configuration.

```bash
# Migrate from AGENT.md to AGENTS.md with symlink for backward compatibility
mv AGENT.md AGENTS.md && ln -s AGENTS.md AGENT.md

```

--------------------------------

### Fetch GitHub contributor data with Next.js

Source: https://context7.com/agentsmd/agents.md/llms.txt

Retrieves contributor avatars and total counts from the GitHub API during build time. It utilizes environment variables for authentication to increase rate limits and implements revalidation for data freshness.

```typescript
import { GetStaticProps } from "next";

interface LandingPageProps {
  contributorsByRepo: Record<string, { avatars: string[]; total: number }>;
}

export const getStaticProps: GetStaticProps<LandingPageProps> = async () => {
  const repoNames = [
    "openai/codex",
    "apache/airflow",
    "temporalio/sdk-java",
    "PlutoLang/Pluto",
  ];

  const baseHeaders: Record<string, string> = {
    "User-Agent": "agents-md-site",
    Accept: "application/vnd.github+json",
  };

  if (process.env.GH_AUTH_TOKEN) {
    baseHeaders["Authorization"] = `Bearer ${process.env.GH_AUTH_TOKEN}`;
  }

  const contributorsByRepo: Record<string, { avatars: string[]; total: number }> = {};

  for (const fullName of repoNames) {
    const avatarsRes = await fetch(
      `https://api.github.com/repos/${fullName}/contributors?per_page=3`,
      { headers: baseHeaders }
    );
    const avatarsData = avatarsRes.ok ? await avatarsRes.json() : [];
    const avatars = avatarsData.slice(0, 3).map((c: any) => c.avatar_url);

    const countRes = await fetch(
      `https://api.github.com/repos/${fullName}/contributors?per_page=1&anon=1`,
      { headers: baseHeaders }
    );
    const link = countRes.headers.get("link");
    let total = avatarsData.length;
    if (link && /rel="last"/.test(link)) {
      const match = link.match(/&?page=(\d+)>; rel="last"/);
      if (match?.[1]) total = parseInt(match[1], 10);
    }

    contributorsByRepo[fullName] = { avatars, total };
  }

  return {
    props: { contributorsByRepo },
    revalidate: 60 * 60 * 24,
  };
};
```

--------------------------------

### Configure Aider to Use AGENTS.md (YAML)

Source: https://context7.com/agentsmd/agents.md/llms.txt

This YAML configuration snippet shows how to instruct the Aider CLI to automatically read the `AGENTS.md` file. By adding the `read: AGENTS.md` directive to the `.aider.conf.yml` file, Aider will use the project's AGENTS.md for context.

```yaml
# .aider.conf.yml
read: AGENTS.md

```

--------------------------------

### Create reusable section layout component

Source: https://context7.com/agentsmd/agents.md/llms.txt

A flexible React component designed for consistent page layout. It supports custom IDs, alignment, and max-width constraints while wrapping content in a standard typography container.

```tsx
import React from "react";

export type SectionProps = React.PropsWithChildren<{
  id?: string;
  className?: string;
  title: string;
  center?: boolean;
  maxWidthClass?: string;
}>;

export default function Section({
  className = "",
  id,
  title,
  children,
  center = false,
  maxWidthClass = "max-w-6xl",
}: SectionProps) {
  return (
    <section id={id} className={className + " px-6"}>
      <div className={`${maxWidthClass} mx-auto flex flex-col gap-6`}>
        <h2 className={`text-3xl font-semibold tracking-tight ${center ? "mx-auto text-center" : ""}`}>
          {title}
        </h2>
        <div className="prose prose-neutral dark:prose-invert max-w-none">
          {children}
        </div>
      </div>
    </section>
  );
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.