К основному содержанию
скилл CX Codex

reactive-programming — скилл для Claude Code: RxJS и потоки

Скилл для работы с реактивными потоками: RxJS, observables, обработка backpressure. Пригодится, когда в проекте много асинхронных данных и событий.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add aj-geddes/useful-ai-prompts --skill reactive-programming -a claude-code
Открыть на GitHub

Что делает reactive-programming

Скилл описывает реактивные паттерны на RxJS: observables, Subject и BehaviorSubject, операторы вроде map, filter, debounceTime, distinctUntilChanged, switchMap. Внутри есть краткий рабочий пример и семь справочных файлов в каталоге references/ — от основ RxJS до поиска с debounce, управления состоянием, WebSocket с переподключением, объединения потоков, backpressure и собственных операторов.

Агент подключает эти материалы, когда вы просите разобрать сложный асинхронный поток, живое обновление данных, состояние интерфейса или обработку WebSocket и SSE. Отдельный раздел с практиками: отписываться от подписок, не вкладывать подписки друг в друга, не забывать про обработку ошибок, использовать shareReplay для дорогих операций. Если в проекте уже есть свой слой работы с потоками, советы из скилла стоит сверить с ним, потому что правила вроде «не подписываться дважды на один observable» ломают код, построенный на ручном управлении подписками.

Скилл ставится в Claude, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode — команды установки различаются, но содержимое одно и то же.

Какие задачи решает

  • собрать поиск с debounce без лишних запросов
  • удержать состояние интерфейса в одном потоке
  • переподключить WebSocket после обрыва
  • объединить данные из нескольких источников
  • разобраться с backpressure в быстром потоке

Примеры запросов агенту

  • Помоги переписать этот поиск на RxJS с debounceTime и switchMap
  • Сделай поток состояния для корзины через BehaviorSubject
  • Добавь переподключение к WebSocket и обработку ошибок

Как установить reactive-programming

1Через Skills CLI (Vercel)

npx skills add aj-geddes/useful-ai-prompts --skill reactive-programming -a claude-code

2Вручную: положить файлы

~/.claude/skills/reactive-programming/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/reactive-programming/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о reactive-programming

Как установить reactive-programming в Claude?

Выполните npx skills add aj-geddes/useful-ai-prompts --skill reactive-programming -a claude-code. Файл скилла появится по пути ~/.claude/skills/reactive-programming/SKILL.md.

Что делает reactive-programming?

Даёт агенту справочники по RxJS и реактивным паттернам: observables, операторы, управление состоянием, WebSocket, backpressure. Агент опирается на них, когда вы просите написать или разобрать асинхронный поток.

Для каких платформ подходит скилл?

Claude, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode. Для каждой платформы своя команда установки, содержимое скилла одинаковое.

Исходный текст

SKILL.md · MIT
---
name: reactive-programming
description: >
  Implement reactive programming patterns using RxJS, streams, observables, and
  backpressure handling. Use when building event-driven UIs, handling async data
  streams, or managing complex data flows.
---

# Reactive Programming

## Table of Contents

- [Overview](#overview)
- [When to Use](#when-to-use)
- [Quick Start](#quick-start)
- [Reference Guides](#reference-guides)
- [Best Practices](#best-practices)

## Overview

Build responsive applications using reactive streams and observables for handling asynchronous data flows.

## When to Use

- Complex async data flows
- Real-time data updates
- Event-driven architectures
- UI state management
- WebSocket/SSE handling
- Combining multiple data sources

## Quick Start

Minimal working example:

```typescript
import {
  Observable,
  Subject,
  BehaviorSubject,
  fromEvent,
  interval,
} from "rxjs";
import {
  map,
  filter,
  debounceTime,
  distinctUntilChanged,
  switchMap,
} from "rxjs/operators";

// Create observable from array
const numbers$ = new Observable<number>((subscriber) => {
  subscriber.next(1);
  subscriber.next(2);
  subscriber.next(3);
  subscriber.complete();
});

numbers$.subscribe({
  next: (value) => console.log(value),
// ... (see reference guides for full implementation)
```

## Reference Guides

Detailed implementations in the `references/` directory:

| Guide | Contents |
|---|---|
| [RxJS Basics](references/rxjs-basics.md) | RxJS Basics |
| [Search with Debounce](references/search-with-debounce.md) | Search with Debounce |
| [State Management](references/state-management.md) | State Management |
| [WebSocket with Reconnection](references/websocket-with-reconnection.md) | WebSocket with Reconnection |
| [Combining Multiple Streams](references/combining-multiple-streams.md) | Combining Multiple Streams |
| [Backpressure Handling](references/backpressure-handling.md) | Backpressure Handling |
| [Custom Operators](references/custom-operators.md) | Custom Operators |

## Best Practices

### ✅ DO

- Unsubscribe to prevent memory leaks
- Use operators to transform data
- Handle errors properly
- Use shareReplay for expensive operations
- Combine streams when needed
- Test reactive code

### ❌ DON'T

- Subscribe multiple times to same observable
- Forget to unsubscribe
- Use nested subscriptions
- Ignore error handling
- Make observables stateful

© aj-geddes · MIT · aj-geddes/useful-ai-prompts

Похожие скиллы

Всё по теме «Фронтенд и UI» →
angular-migration Seth Hobson Помогает переносить приложения с AngularJS на Angular по частям или целиком. Пригодится для гибридных приложений, замены компонентов и обновления зависимостей. CX Codex 10 900установок angular-architect https://github.com/Jeffallan Скилл для Claude Code и других ИИ-редакторов: собирает компоненты Angular 17+ на standalone и сигналах, настраивает маршрутизацию, NgRx и RxJS. CX Codex +1 4 800установок node mcollina Даёт агенту правила для Node.js и TypeScript: от запуска .ts без сборки до потоков, тестов и остановки сервиса. CX Codex +1 5 900установок bun-hot-reloading secondsky Скилл подсказывает агенту, как настроить горячую перезагрузку в Bun: режимы --watch и --hot, HMR и перезапуск HTTP-сервера. CX Codex +1 395установок golang-samber-ro samber Учит агента работать с библиотекой samber/ro — реализацией ReactiveX в Go с 150+ операторами, холодными и горячими observable, пятью типами subject и автоматическим backpressure. CX Codex +1 38 200установок add-voice cursor Добавляет в приложение голосовой диалог Grok с передачей речи в обе стороны. Нужен при замене каскада STT-LLM-TTS или OpenAI Realtime. CX Codex +1 319установок

Из того же набора118

Model Hyperparameter Tuning Скилл для подбора гиперпараметров моделей: grid search, random search, байесовская оптимизация через Optuna. Пригодится, когда базовые настройки уже не тянут. CX Codex +1 494установок api-reference-documentation Скилл помогает агенту собрать справочник по API: эндпоинты, аутентификация, примеры запросов и ответов, спецификация OpenAPI. CX Codex +1 494установок database-performance-debugging Скилл помогает найти медленные SQL-запросы и разобрать их планы выполнения. Пригодится, когда приложение тормозит или база упирается в CPU. CX Codex +1 493установок code-documentation Скилл для написания документации прямо в коде: JSDoc, Python-докстринги, JavaDoc, комментарии и описания API. Пригодится, когда нужно задокументировать функции и классы, а не переписывать их вслепую. CX Codex +1 492установок api-pagination Скилл подсказывает агенту, как отдавать большие коллекции: offset/limit, курсоры, keyset. Пригодится, когда список пользователей или результатов поиска не влезает в один ответ. CX Codex +1 489установок nosql-database-design Помогает агенту проектировать коллекции MongoDB и таблицы DynamoDB: вложенные документы, индексы, денормализация. Пригодится, когда схему надо решить до кода. CX Codex +1 486установок database-indexing-strategy Скилл помогает проектировать индексы: выбирает тип, собирает составные и частичные, подсказывает по обслуживанию. Пригодится, когда запросы тормозят. CX Codex +1 486установок uptime-monitoring Скилл для ИИ-агента, который помогает настроить проверки доступности сервиса, статус-страницу и учёт инцидентов. Пригодится, когда нужно видеть, что именно упало. CX Codex +1 484установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой