CLAUDE.md TypeScript React Backend

Kaneo: セルフホスト型プロジェクト管理

本番モノレポ(Honoバックエンド + Reactフロントエンド)の優秀な構造のCLAUDE.md。共通パターンのコード例と哲学:「機能は実際の問題を解決するために存在する。」

CLAUDE.md · 65 lines
# CLAUDE.md - Kaneo

Self-hosted project management platform. pnpm monorepo: Hono backend + React frontend.

**Key Philosophy:** Features exist to solve real problems, not to impress. Avoid over-engineering.

## Commands
```bash
pnpm dev              # Start all services
pnpm build            # Build all packages
pnpm db:generate      # Generate DB migrations
pnpm db:migrate       # Run DB migrations
```

## Architecture
```
apps/
  api/          # Hono backend (Bun runtime)
  web/          # React SPA (Vite + TanStack Router)
packages/
  db/           # Drizzle ORM schemas + migrations
  shared/       # Shared types and utilities
```

## Code Style
- TypeScript strict mode everywhere
- Functional components with hooks
- Drizzle ORM for all DB operations (no raw SQL)
- Zod for runtime validation
- TanStack Query for server state

## Common Patterns

### Backend Route
```typescript
app.get("/tasks/:id", async (c) => {
  const { id } = c.req.param();
  const task = await db.query.tasks.findFirst({
    where: eq(tasks.id, id),
    with: { assignee: true, project: true }
  });
  if (!task) return c.json({ error: "Not found" }, 404);
  return c.json(task);
});
```

### Frontend Query Hook
```typescript
export function useTask(id: string) {
  return useQuery({
    queryKey: ["task", id],
    queryFn: () => api.get(`/tasks/${id}`).json(),
  });
}
```

### Database Schema
```typescript
export const tasks = sqliteTable("tasks", {
  id: text("id").primaryKey().$defaultFn(() => createId()),
  title: text("title").notNull(),
  status: text("status", { enum: ["todo", "in_progress", "done"] }).default("todo"),
  createdAt: integer("created_at", { mode: "timestamp" }).$defaultFn(() => new Date()),
});
```
Share on X

こちらもおすすめ

Backend カテゴリの他のルール

もっとルールを探す

CLAUDE.md、.cursorrules、AGENTS.md、Image Prompts の全 157 ルールをチェック。