# Koota

> Use Koota for data-oriented Entity Component System architecture with React bindings. Use when this capability is needed.

- Skill: `tomevault-io/koota-2` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add tomevault-io/koota-2`
- Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/koota-2/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: tomevault-io (https://skillmd.com/u/tomevault-io)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/tomevault-io/koota-2

---


# Koota ECS

Use Koota for data-oriented Entity Component System architecture with React bindings.

When setting up or undertaking important changes with Koota, fetch the documentations:

https://raw.githubusercontent.com/pmndrs/koota/refs/heads/main/README.md

## Technique

Define traits (components) with `trait()`, create a world, spawn entities with traits, and query entities in systems. Use `useQuery` to reactively render entities and `useTraitEffect` to respond to trait changes.

## Key Concepts

- `trait()` defines component schemas with default values
- `world.spawn()` creates entities with traits
- `world.query()` finds entities matching traits
- `useQuery()` hook for reactive entity lists in React
- `useTraitEffect()` for responding to trait changes without re-rendering
- Systems are React components that use `useFrame` to update entities (they return `null`, not views)

## Usage

```tsx
const Position = trait({ x: 0, y: 0 })
const IsCharacter = trait()

const world = createWorld()

// Spawn
world.spawn(Position({ x: 1, y: 2 }), IsCharacter)

// Query in system
world.query(Position).updateEach(([position]) => {
  position.x += 0.01
})

// React component
const characters = useQuery(Position, IsCharacter)
```

---

This skill is part of [verekia](https://x.com/verekia)'s [**r3f-gamedev**](https://github.com/verekia/r3f-gamedev).

---
> Converted and distributed by [TomeVault](https://tomevault.io/claim/verekia) — claim your Tome and manage your conversions.
<!-- tomevault:4.0:skill_md:2026-04-11 -->