Your Code Is Under New Management

Agents that review your code. Locally or on every PR.

Install

Install the CLI globally.

$ npm install -g @sentry/warden

Initialize

Scaffold your project with config and GitHub workflow.

$ warden init

Created warden.toml
Created .github/workflows/warden.yml

Next steps:
  1. Add a skill: warden add <skill-name>
  2. Set WARDEN_ANTHROPIC_API_KEY in .env.local
  3. Add WARDEN_ANTHROPIC_API_KEY to repository secrets
     https://github.com/your-org/your-repo/settings/secrets/actions
  4. Commit and open a PR to test

Add some skills

Install a skill from the community. Vercel's React best practices is a great start.

$ npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices
$ warden add vercel-react-best-practices

Run Locally

Catch issues before you push. Fix them immediately.

$ warden

Analyzing uncommitted changes...

FILES  3 files · 5 chunks
  ~ src/components/UserList.tsx (2 chunks)
  ~ src/components/Dashboard.tsx (2 chunks)
  + src/components/Modal.tsx (1 chunk)

┌─ vercel-react-best-practices ──────────────────────────── 8.2s ─┐
│ 2 findings:  1 medium   1 low                                 │
├─────────────────────────────────────────────────────────────────┤
│                                                                 │
│  Missing React.memo for list items                             │
│   src/components/UserList.tsx:15                                │
│   15 │ const UserCard = ({ user }) => <div>{user.name}</div>;   │
│                                                                 │
│   List item components should be memoized to prevent            │
│   unnecessary re-renders when parent state changes.             │
│                                                                 │
│  useEffect missing dependency                                  │
│   src/components/Dashboard.tsx:23                               │
│   23 │ useEffect(() => { fetchData() }, [])                     │
│                                                                 │
│   The dependency array is missing 'fetchData'. This could       │
│   lead to stale closures or unexpected behavior.                │
│                                                                 │
└─────────────────────────────────────────────────────────────────┘

SUMMARY
2 findings:  1 medium   1 low
Analysis completed in 8.2s

Keep an Eye on GitHub

Open a PR and Warden reviews it automatically. Findings appear as suggested changes you can apply with one click.

warden bot commented now
Missing React.memo for list items

List item components should be memoized to prevent unnecessary re-renders when parent state changes.

Suggested fix: Wrap UserCard with React.memo

Suggested change
const UserCard = ({ user }) => <div>{user.name}</div>;
+ const UserCard = React.memo(({ user }) => (
+ <div>{user.name}</div>
+ ));

Next Steps