reopt designreopt design
DocsExploreToolsPricingBuilder
Explore/
opt-ui161opt-charts21opt-datagrid5opt-editor5opt-chat6opt-shell14brandapp-ui8Examples12
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

© 2026 reopt-ai. All rights reserved.

Explore/opt-shell/Landing Page
Recipeopt-shell example

Landing Page

ShellLandingPage와 ShellSection으로 공개 랜딩의 hero, stats strip, feature section을 같은 정책 아래 묶습니다.

Public-facing landing recipe that keeps hero, sections, and footer aligned.

landingherosection
bun add @reopt-ai/opt-shell @reopt-ai/opt-ui
ShellProviderShellLandingPageShellSection
1024px
Pipeline Monitoring Platform

Data Console

데이터 파이프라인의 상태, 실행 이력, 장애 대응을 한 흐름으로 다루는 콘솔입니다. 실시간 모니터링부터 인시던트 트리아지까지.

Go to OverviewView Pipelines
247
Runs / 24h
4.7 TB
Data processed
99.97%
Uptime
4.2s
Avg latency

Core Capabilities

Everything you need to keep your data pipelines healthy.

Real-time Pipeline Monitoring

6

Track pipeline health, throughput, and latency across all environments with sub-second refresh.

Pipelines tracked

Incident Triage

94.3%

Correlate failures, group by root cause, and assign owners with a single click.

Success rate SLO

Execution Analytics

4.2s

Stage-level profiling, throughput trends, and cost attribution for every pipeline run.

Avg latency

Smart Alerting

14

ML-driven anomaly detection and threshold alerts with configurable routing to Slack, PagerDuty, or email.

Active alert rules

Ready to explore?

Navigate to the Overview to see live pipeline health metrics.

Open Overview Dashboard
Data Console · LandingWorkspace recipe demo · @reopt-ai/opt-shell

Related Examples

스크롤 가능한 콘텐츠 영역
3개 항목 선택됨
Layoutopt-shell

Bottom Bar

ShellBottomBar로 선택 액션과 승인 액션을 화면 하단에 sticky하게 붙여 작업 맥락을 유지합니다.

stickybulk-actionsfooter
ShellProviderShellBottomBar
Open

Completeness Score

audit finding 수를 조절하면서 점수 변화를 확인하세요.

3/5
72/ 1007/10 passed
layout0%
recipe-contract67%
adapter-ownership100%
state-ux100%
design-document100%
scaffold-bundle100%
accessibility100%
Scoringopt-shell

Completeness Score

computeCompletenessScore로 audit finding을 7개 카테고리로 분류하고 0-100 가중 평균 점수를 산출합니다.

completenessscoreauditscoring
computeCompletenessScore
Open

Coverage Report

8개 라우트 파일 대비 하네스 rollout target 매칭 결과

75%6/8 covered
Recipe Breakdown
dashboard: 1list: 1detail: 1editor: 1fullscreen: 1
Uncovered Paths
  • app/settings/page.tsx
  • app/analytics/page.tsx
Scoringopt-shell

Coverage Report

computeShellCoverage로 라우트 파일 대비 하네스 채택률을 정적 분석하고 recipe별 breakdown과 미커버 경로를 표시합니다.

coverageroutesrolloutscoring
computeShellCoverage
Open
PreviousList WorkspaceNextState Boundary