Back to Experiments
EXP.05 Vue Coming Soon

Incident Response System

Multi-channel incident coordination with escalation workflows.

Interactive

Live Demo

Demo Coming Soon

The live demo for this experiment is not yet available.

Context

The Problem

When something breaks in production, communication becomes as important as technical fixes. Who knows? Who needs to know? What's the status? When was the last update?

Most incident response tools are either too simple (a shared doc) or too complex (enterprise platforms with weeks of setup). I wanted something in between.

Background

The Connection

My background is full of structured response protocols:

  • Military chain of command — Clear escalation paths, defined roles, standardized reporting
  • Emergency response — The incident commander model used in firefighting and rescue
  • On-call rotations — Data center operations with 24/7 coverage and handoffs

Architecture

The Approach

Vue was chosen to demonstrate versatility across frameworks. The composition API provides clean separation of concerns for complex state management.

The system provides: - Incident creation with severity levels - Automatic escalation based on time and severity - Multi-channel notifications (Slack, PagerDuty, email) - Timeline with all actions and status changes - Post-incident review workflow

Code

Technical Deep Dive

The escalation engine runs on Cloudflare Workers with scheduled triggers. When an incident is created, it schedules escalation checks. If acknowledgment doesn't happen within SLA, it escalates to the next tier.

The timeline is append-only with timestamps from the edge location, providing accurate ordering even with clock skew.

typescript
// Escalation workflow
interface EscalationPolicy {
  levels: Array<{
    timeout: number; // seconds
    notify: string[]; // user IDs or channels
    method: 'slack' | 'page' | 'email';
  }>;
}

async function checkEscalation(incident: Incident) {
  const policy = getPolicy(incident.severity);
  const elapsed = Date.now() - incident.createdAt;

  for (const level of policy.levels) {
    if (elapsed > level.timeout * 1000 &&
        !incident.acknowledgedAt) {
      await notify(level.notify, level.method, incident);
    }
  }
}

Time-based escalation with configurable policies

Retrospective

What I Learned

What worked well:

  • Vue 3 Composition API is genuinely great for complex state
  • Edge-based scheduling provides reliable escalation timing
  • The timeline view became the most-used feature
  • What I'd change:

  • Would integrate with more notification channels
  • Runbook integration (link to docs for common incidents)
  • Trade-offs accepted:

  • No ML-based incident classification — rules-based only
  • Limited to text communication (no voice/video escalation)
  • Technologies

    The Stack

    Vue 3 UI framework
    TypeScript Type safety
    Cloudflare Workers Escalation engine
    D1 Incident storage