Reactive Programming

Handles async data flows with RxJS observables and streams. You'll want this when building real-time features like search with debounce, WebSocket connections with auto-reconnect, or complex UI state management where multiple data sources need to combine. The skill covers operators for transforming streams, backpressure handling when data arrives faster than you can process it, and practical patterns for avoiding the nested subscription hell that kills most reactive codebases. The emphasis on unsubscribing and memory leak prevention is spot on because that's where most teams get burned in production.

skills.sh installs: 496
GitHub stars: 379
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add aj-geddes/useful-ai-prompts --skill reactive-programming --agent claude-code

Installs into .claude/skills of the current project.

Files

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:

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)