Suggest an edit

Improve this article

Refine the answer for “What are the main entities in Akita?”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

Akita has just **three main entities**, and that's enough to fully manage state.

### 1. **Store**

Stores data and is responsible for updating it.

- This is a class that holds the entire state.
- You define how it looks yourself (object, array, dictionary).
- It changes through `store.update()`, `store.set()`, `store.add()`, `store.remove()`, and so on.

**Example:**

```ts
@StoreConfig({ name: 'todos' })
@Injectable()
export class TodosStore extends Store<TodoState> {
  constructor() {
    super({ todos: [] }); // initial state
  }
}
```

### 2. **Query**

Responsible for reading data from the Store.

- Subscribing to `todos$`, `activeTodo$`, `count$`, and so on.
- You can write your own methods: `selectById(id)`, `isEmpty()`, and so on.

**Example:**

```ts
@Injectable()
export class TodosQuery extends Query<TodoState> {
  todos$ = this.select(state => state.todos);

constructor(protected store: TodosStore) {
    super(store);
  }
}
```

### 3. **Service**

Business logic: API requests, calling Store methods.

- This is where you call `http.get()`, `store.update()`, and so on.
- Service isn't part of Akita itself, but it's the commonly accepted structure.

**Example:**

```ts
@Injectable()
export class TodosService {
  constructor(private todosStore: TodosStore) {}

add(todo: Todo) {
    this.todosStore.update(state => ({
      todos: [...state.todos, todo]
    }));
  }
}
```

### Additionally (if needed):

- **EntityStore** - a special kind of Store for collections with `ids` and `entities`.
- **UI Store** - for storing UI state (for example, loading, selectedId).
- **Plugins** - for example, for devtools, undo/redo, persist.

### Conclusion:

**Store** - saves the data.
**Query** - hands data to components.
**Service** - manages actions.

Akita is simple: three parts, and you already have a full-fledged reactive store.

Markdown · drag & drop images · ⌘B / ⌘I shortcuts260 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.