mega-framework 0.1.0

package/sample/crud/apps/main/views/logs/index.ejs

@@ -0,0 +1,80 @@
+<% layout('layouts/main') %>
+<%
+  function fmt(d) { return new Date(d).toLocaleString('ko-KR', { hour12: false, timeZone: 'Asia/Seoul' }) }
+  function levelBadge(l) { return l === 'error' ? 'text-bg-danger' : l === 'warn' ? 'text-bg-warning' : l === 'debug' ? 'text-bg-secondary' : 'text-bg-info' }
+%>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('logs_title', '구조적 로깅') %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('logs_subtitle', 'pino 로그를 emit 하고 trace_id·민감필드 마스킹을 시연합니다.') %></p>
+</div>
+
+<% if (typeof notice !== 'undefined' && notice) { %>
+  <div class="alert alert-success alert-dismissible fade show" role="alert">
+    <%= notice %>
+    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="close"></button>
+  </div>
+<% } %>
+
+<div class="row g-3">
+  <div class="col-lg-5">
+    <div class="card h-100">
+      <div class="card-body">
+        <h2 class="h5 card-title"><%= t('logs_emit_title', '로그 emit') %></h2>
+        <p class="card-text text-body-secondary small"><%= t('logs_emit_desc', '선택한 레벨로 로그 1건을 실제 logger 로 내보냅니다.') %></p>
+        <form method="post" action="/demo/logs/emit">
+          <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+          <div class="mb-2">
+            <label class="form-label small mb-1" for="level"><%= t('logs_level', '레벨') %></label>
+            <select class="form-select form-select-sm" id="level" name="level">
+              <% snap.levels.forEach(function (l) { %>
+                <option value="<%= l %>" <%= l === 'info' ? 'selected' : '' %>><%= l %></option>
+              <% }) %>
+            </select>
+          </div>
+          <div class="mb-3">
+            <label class="form-label small mb-1" for="message"><%= t('logs_message', '메시지') %></label>
+            <input type="text" class="form-control form-control-sm" id="message" name="message" placeholder="<%= t('logs_message_ph', '예: 데모 로그 한 줄') %>" />
+          </div>
+          <button type="submit" class="btn btn-primary btn-sm"><%= t('logs_emit_btn', 'emit') %></button>
+        </form>
+        <div class="alert alert-info small mt-3 mb-0"><%= t('logs_redact_hint', '로그 payload 의 token/password/secret 은 console 출력에서 [Redacted] 로 마스킹되고, 활성 trace_id 가 자동 첨부됩니다 (ADR-141). 서버 콘솔에서 확인하세요.') %></div>
+      </div>
+    </div>
+  </div>
+
+  <div class="col-lg-7">
+    <div class="card h-100">
+      <div class="card-body">
+        <h2 class="h5 card-title"><%= t('logs_recent_title', '최근 emit') %></h2>
+        <p class="card-text text-body-secondary small"><%= t('logs_recent_desc', 'emit 한 로그의 안전한 메타데이터입니다 (시크릿 제외).') %></p>
+        <% if (snap.recent.length === 0) { %>
+          <p class="text-body-secondary small mb-0"><%= t('logs_recent_empty', '아직 emit 한 로그가 없습니다.') %></p>
+        <% } else { %>
+          <div class="table-responsive">
+            <table class="table table-sm align-middle mb-0">
+              <thead>
+                <tr>
+                  <th scope="col"><%= t('logs_recent_at', '시각') %></th>
+                  <th scope="col"><%= t('logs_level', '레벨') %></th>
+                  <th scope="col"><%= t('logs_message', '메시지') %></th>
+                  <th scope="col"><%= t('logs_recent_trace', 'trace_id') %></th>
+                </tr>
+              </thead>
+              <tbody>
+                <% snap.recent.forEach(function (e) { %>
+                  <tr>
+                    <td class="font-monospace small"><%= fmt(e.at) %></td>
+                    <td><span class="badge <%= levelBadge(e.level) %>"><%= e.level %></span></td>
+                    <td class="small"><%= e.message %></td>
+                    <td class="font-monospace small text-break"><%= e.traceId ? e.traceId.slice(0, 16) + '…' : '—' %></td>
+                  </tr>
+                <% }) %>
+              </tbody>
+            </table>
+          </div>
+        <% } %>
+      </div>
+    </div>
+  </div>
+</div>

package/sample/crud/apps/main/views/metrics/index.ejs

@@ -0,0 +1,123 @@
+<% layout('layouts/main') %>
+<%
+  // 숫자 포맷 헬퍼 — 정수는 천단위 콤마, 소수는 1자리.
+  function n(v) { return Number(v).toLocaleString('en-US') }
+  function f1(v) { return Number(v).toFixed(1) }
+  function classBadge(c) { return c === '2xx' ? 'text-bg-success' : c === '3xx' ? 'text-bg-info' : c === '4xx' ? 'text-bg-warning' : 'text-bg-danger' }
+  // 잡 카운터는 키가 동적(metrics_jobs_<e>)이라 t() defaultValue 로 항목별 한국어 폴백을 직접 매핑한다.
+  const jobsLabel = { enqueued: '등록', processed: '처리', retried: '재시도', dlq: 'DLQ' }
+%>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('metrics_title', '메트릭') %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('metrics_subtitle', 'Prometheus /metrics 카운터를 사람이 보기 좋은 카드로 보여줍니다 (웹 프로세스 기준).') %></p>
+</div>
+
+<% if (!snap.enabled) { %>
+  <div class="alert alert-warning" role="alert"><%= t('metrics_disabled', '메트릭이 비활성화되어 있습니다. mega.config.js 의 health.exposeMetrics 를 확인하세요.') %></div>
+<% } else { %>
+  <div class="row g-3">
+    <div class="col-lg-6">
+      <div class="card h-100">
+        <div class="card-body">
+          <h2 class="h5 card-title"><%= t('metrics_http_title', 'HTTP 요청') %></h2>
+          <p class="card-text text-body-secondary small"><%= t('metrics_http_desc', '상태 코드 분류별 누적 요청 수입니다.') %></p>
+          <div class="display-5 fw-bold"><%= n(snap.http.total) %></div>
+          <div class="text-body-secondary small mb-3"><%= t('metrics_http_total', '총 요청 수') %></div>
+          <div class="d-flex flex-wrap gap-2">
+            <% Object.keys(snap.http.byClass).forEach(function (c) { %>
+              <span class="badge <%= classBadge(c) %>"><%= c %>: <%= n(snap.http.byClass[c]) %></span>
+            <% }) %>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="col-lg-6">
+      <div class="card h-100">
+        <div class="card-body">
+          <h2 class="h5 card-title"><%= t('metrics_process_title', '프로세스') %></h2>
+          <p class="card-text text-body-secondary small"><%= t('metrics_process_desc', '현재 웹 프로세스의 메모리·가동시간·CPU 사용량입니다.') %></p>
+          <ul class="list-group list-group-flush mt-1">
+            <li class="list-group-item d-flex justify-content-between px-0">
+              <span><%= t('metrics_process_heap', '힙 사용량') %></span><span class="font-monospace"><%= f1(snap.process.heapUsedMb) %> MB</span>
+            </li>
+            <li class="list-group-item d-flex justify-content-between px-0">
+              <span><%= t('metrics_process_rss', 'RSS') %></span><span class="font-monospace"><%= f1(snap.process.rssMb) %> MB</span>
+            </li>
+            <li class="list-group-item d-flex justify-content-between px-0">
+              <span><%= t('metrics_process_uptime', '가동 시간') %></span><span class="font-monospace"><%= n(Math.round(snap.process.uptimeSec)) %> s</span>
+            </li>
+            <li class="list-group-item d-flex justify-content-between px-0">
+              <span><%= t('metrics_process_cpu', 'CPU 시간') %></span><span class="font-monospace"><%= f1(snap.process.cpuSec) %> s</span>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+
+    <div class="col-lg-6">
+      <div class="card h-100">
+        <div class="card-body">
+          <h2 class="h5 card-title"><%= t('metrics_jobs_title', '잡 큐') %></h2>
+          <p class="card-text text-body-secondary small"><%= t('metrics_jobs_desc', '잡 처리 이벤트 누적 수입니다 (잡 데모와 연동).') %></p>
+          <div class="row text-center g-2 mt-1">
+            <% ['enqueued','processed','retried','dlq'].forEach(function (e) { %>
+              <div class="col-6 col-sm-3">
+                <div class="border rounded py-2">
+                  <div class="h4 fw-bold mb-0"><%= n(snap.jobs[e]) %></div>
+                  <div class="text-body-secondary small"><%= t('metrics_jobs_' + e, jobsLabel[e]) %></div>
+                </div>
+              </div>
+            <% }) %>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="col-lg-6">
+      <div class="card h-100">
+        <div class="card-body">
+          <h2 class="h5 card-title"><%= t('metrics_ws_title', 'WebSocket') %></h2>
+          <p class="card-text text-body-secondary small"><%= t('metrics_ws_desc', 'WS 메시지 누적 수입니다 (채팅 데모와 연동).') %></p>
+          <div class="display-6 fw-bold"><%= n(snap.ws.total) %></div>
+          <div class="text-body-secondary small mb-2"><%= t('metrics_ws_total', '총 메시지 수') %></div>
+          <% if (snap.ws.byType.length > 0) { %>
+            <div class="d-flex flex-wrap gap-2">
+              <% snap.ws.byType.forEach(function (r) { %>
+                <span class="badge text-bg-light"><code><%= r.type %></code> <%= n(r.count) %></span>
+              <% }) %>
+            </div>
+          <% } else { %>
+            <p class="text-body-secondary small mb-0"><%= t('metrics_ws_empty', '아직 WS 메시지가 없습니다.') %></p>
+          <% } %>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="card mt-3">
+    <div class="card-body">
+      <h2 class="h5 card-title"><%= t('metrics_routes_title', '라우트별 요청 수') %></h2>
+      <p class="card-text text-body-secondary small"><%= t('metrics_routes_desc', '요청이 많은 상위 라우트입니다.') %></p>
+      <% if (snap.http.topRoutes.length === 0) { %>
+        <p class="text-body-secondary small mb-0"><%= t('metrics_routes_empty', '아직 기록된 요청이 없습니다.') %></p>
+      <% } else { %>
+        <div class="table-responsive">
+          <table class="table table-sm align-middle mb-0">
+            <thead><tr><th scope="col"><%= t('metrics_routes_route', '라우트') %></th><th scope="col" class="text-end"><%= t('metrics_routes_count', '요청 수') %></th></tr></thead>
+            <tbody>
+              <% snap.http.topRoutes.forEach(function (r) { %>
+                <tr><td class="font-monospace small"><%= r.route %></td><td class="text-end font-monospace"><%= n(r.count) %></td></tr>
+              <% }) %>
+            </tbody>
+          </table>
+        </div>
+      <% } %>
+    </div>
+  </div>
+<% } %>
+
+<p class="text-body-secondary small mt-3 mb-0">
+  <%= t('metrics_raw_hint', '원본(Prometheus scrape 포맷):') %> <a href="<%= snap.metricsPath %>" target="_blank" rel="noopener"><code><%= snap.metricsPath %></code></a>
+</p>

package/sample/crud/apps/main/views/notes/edit.ejs

@@ -0,0 +1,45 @@
+<% layout('layouts/main') %>
+
+<div class="row justify-content-center">
+  <div class="col-lg-6">
+    <h1 class="h3 mb-4"><%= t('notes_edit_title', { defaultValue: '노트 수정' }) %></h1>
+
+    <% if (typeof error !== 'undefined' && error) { %>
+      <div class="alert alert-danger" role="alert"><%= error %></div>
+    <% } %>
+
+    <form method="post" action="/demo/notes/<%= values.id %>" novalidate>
+      <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+
+      <div class="mb-3">
+        <label for="title" class="form-label"><%= t('notes_field_title', { defaultValue: '제목' }) %></label>
+        <input
+          type="text"
+          class="form-control <%= invalid && invalid.title ? 'is-invalid' : '' %>"
+          id="title"
+          name="title"
+          value="<%= values && values.title ? values.title : '' %>"
+          placeholder="<%= t('notes_field_title_ph', { defaultValue: '예: 회의 메모' }) %>"
+          required
+        />
+        <div class="invalid-feedback"><%= t('notes_field_title_required', { defaultValue: '제목을 입력하세요.' }) %></div>
+      </div>
+
+      <div class="mb-4">
+        <label for="body" class="form-label"><%= t('notes_field_body', { defaultValue: '본문' }) %></label>
+        <textarea
+          class="form-control"
+          id="body"
+          name="body"
+          rows="4"
+          placeholder="<%= t('notes_field_body_ph', { defaultValue: '내용을 입력하세요 (선택).' }) %>"
+        ><%= values && values.body ? values.body : '' %></textarea>
+      </div>
+
+      <div class="d-flex gap-2">
+        <button type="submit" class="btn btn-primary"><%= t('btn_save', { defaultValue: '저장' }) %></button>
+        <a href="/demo/notes" class="btn btn-outline-secondary"><%= t('btn_cancel', { defaultValue: '취소' }) %></a>
+      </div>
+    </form>
+  </div>
+</div>

package/sample/crud/apps/main/views/notes/list.ejs

@@ -0,0 +1,74 @@
+<% layout('layouts/main') %>
+
+<div class="d-flex flex-wrap align-items-center justify-content-between gap-2 mb-4">
+  <div>
+    <h1 class="h3 mb-1"><%= t('notes_title', { defaultValue: '노트 (MongoDB)' }) %></h1>
+    <p class="text-body-secondary small mb-0"><%= t('notes_subtitle', { defaultValue: 'MongoDB 도큐먼트 어댑터로 notes 컬렉션을 생성·조회·수정·삭제합니다.' }) %></p>
+  </div>
+  <a href="/demo/notes/new" class="btn btn-primary">+ <%= t('notes_new', { defaultValue: '노트 추가' }) %></a>
+</div>
+
+<% if (typeof notice !== 'undefined' && notice) { %>
+  <div class="alert alert-success alert-dismissible fade show" role="alert">
+    <%= notice %>
+    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="close"></button>
+  </div>
+<% } %>
+
+<% if (!notes || notes.length === 0) { %>
+  <div class="text-center text-body-secondary py-5">
+    <div class="display-4 mb-3">📝</div>
+    <p class="mb-3"><%= t('notes_empty', { defaultValue: '아직 노트가 없습니다.' }) %></p>
+    <a href="/demo/notes/new" class="btn btn-outline-primary"><%= t('notes_new', { defaultValue: '노트 추가' }) %></a>
+  </div>
+<% } else { %>
+  <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3">
+    <% notes.forEach(function (n) { %>
+      <div class="col">
+        <div class="card h-100">
+          <div class="card-body d-flex flex-column">
+            <h2 class="h5 card-title"><%= n.title %></h2>
+            <p class="card-text text-body-secondary flex-grow-1"><%= n.body || '—' %></p>
+            <div class="text-body-secondary small mb-3"><%= n.created_at %></div>
+            <div class="d-flex gap-2">
+              <a href="/demo/notes/<%= n.id %>/edit" class="btn btn-sm btn-outline-secondary"><%= t('action_edit', { defaultValue: '수정' }) %></a>
+              <button
+                type="button"
+                class="btn btn-sm btn-outline-danger"
+                data-bs-toggle="modal"
+                data-bs-target="#deleteModal"
+                data-action="/demo/notes/<%= n.id %>/delete"
+                data-name="<%= n.title %>"
+              >
+                <%= t('action_delete', { defaultValue: '삭제' }) %>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    <% }) %>
+  </div>
+<% } %>
+
+<%# 삭제 확인 모달 — users 목록과 동일 패턴. 클릭된 카드의 data-action/data-name 으로 app.js 가 form·문구를
+    채운다(show.bs.modal). 인라인 스크립트는 CSP(script-src 'self')에 막히므로 wiring 은 app.js(외부)에 둔다. %>
+<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
+  <div class="modal-dialog modal-dialog-centered">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="deleteModalLabel"><%= t('delete_confirm_title', { defaultValue: '삭제 확인' }) %></h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button>
+      </div>
+      <div class="modal-body">
+        <%= t('delete_confirm_body', { defaultValue: '정말 삭제할까요?' }) %> <strong id="deleteModalName"></strong>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><%= t('delete_confirm_cancel', { defaultValue: '취소' }) %></button>
+        <form id="deleteForm" method="post" class="d-inline">
+          <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+          <button type="submit" class="btn btn-danger"><%= t('delete_confirm_ok', { defaultValue: '삭제' }) %></button>
+        </form>
+      </div>
+    </div>
+  </div>
+</div>

package/sample/crud/apps/main/views/notes/new.ejs

@@ -0,0 +1,45 @@
+<% layout('layouts/main') %>
+
+<div class="row justify-content-center">
+  <div class="col-lg-6">
+    <h1 class="h3 mb-4"><%= t('notes_new_title', { defaultValue: '노트 추가' }) %></h1>
+
+    <% if (typeof error !== 'undefined' && error) { %>
+      <div class="alert alert-danger" role="alert"><%= error %></div>
+    <% } %>
+
+    <form method="post" action="/demo/notes" novalidate>
+      <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+
+      <div class="mb-3">
+        <label for="title" class="form-label"><%= t('notes_field_title', { defaultValue: '제목' }) %></label>
+        <input
+          type="text"
+          class="form-control <%= invalid && invalid.title ? 'is-invalid' : '' %>"
+          id="title"
+          name="title"
+          value="<%= values && values.title ? values.title : '' %>"
+          placeholder="<%= t('notes_field_title_ph', { defaultValue: '예: 회의 메모' }) %>"
+          required
+        />
+        <div class="invalid-feedback"><%= t('notes_field_title_required', { defaultValue: '제목을 입력하세요.' }) %></div>
+      </div>
+
+      <div class="mb-4">
+        <label for="body" class="form-label"><%= t('notes_field_body', { defaultValue: '본문' }) %></label>
+        <textarea
+          class="form-control"
+          id="body"
+          name="body"
+          rows="4"
+          placeholder="<%= t('notes_field_body_ph', { defaultValue: '내용을 입력하세요 (선택).' }) %>"
+        ><%= values && values.body ? values.body : '' %></textarea>
+      </div>
+
+      <div class="d-flex gap-2">
+        <button type="submit" class="btn btn-primary"><%= t('btn_create', { defaultValue: '생성' }) %></button>
+        <a href="/demo/notes" class="btn btn-outline-secondary"><%= t('btn_cancel', { defaultValue: '취소' }) %></a>
+      </div>
+    </form>
+  </div>
+</div>

package/sample/crud/apps/main/views/perf/index.ejs

@@ -0,0 +1,90 @@
+<% layout('layouts/main') %>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('perf_title', '성능 벤치마크') %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('perf_subtitle', '프레임워크 주요 표면(HTTP·암호화·DB·캐시·세션)의 처리량과 지연을 Node 내장 perf_hooks 로 직접 측정합니다.') %></p>
+</div>
+
+<div class="row g-3">
+  <div class="col-lg-5">
+    <div class="card h-100">
+      <div class="card-body d-flex flex-column">
+        <h2 class="h5 card-title"><%= t('perf_form_title', '벤치마크 실행') %></h2>
+        <p class="card-text text-body-secondary small"><%= t('perf_form_desc', '시나리오와 반복 횟수를 고르고 실행하면 per-iteration 지연을 모아 백분위수를 계산합니다.') %></p>
+
+        <div class="mb-3">
+          <label for="pf-scenario" class="form-label small"><%= t('perf_scenario_label', '시나리오') %></label>
+          <select class="form-select form-select-sm font-monospace" id="pf-scenario">
+            <% scenarios.forEach(function (s) { %>
+              <option value="<%= s %>"><%= s %></option>
+            <% }) %>
+          </select>
+        </div>
+
+        <div class="row g-2 mb-3">
+          <div class="col-4">
+            <label for="pf-iterations" class="form-label small"><%= t('perf_iterations_label', '반복') %></label>
+            <input type="number" class="form-control form-control-sm" id="pf-iterations" value="1000" min="1" max="100000" step="100" />
+          </div>
+          <div class="col-4">
+            <label for="pf-concurrency" class="form-label small"><%= t('perf_concurrency_label', '동시성') %></label>
+            <input type="number" class="form-control form-control-sm" id="pf-concurrency" placeholder="auto" min="1" max="100" step="1" />
+          </div>
+          <div class="col-4">
+            <label for="pf-payload" class="form-label small"><%= t('perf_payload_label', '페이로드(byte)') %></label>
+            <input type="number" class="form-control form-control-sm" id="pf-payload" placeholder="0" min="0" max="1048576" step="64" />
+          </div>
+        </div>
+        <p class="text-body-secondary small mb-3"><%= t('perf_limit_hint', '동시성·페이로드를 비우면 시나리오별 기본값을 씁니다. 안전을 위해 시나리오마다 반복·동시성 상한이 있으며, 초과하면 자동으로 줄이고 결과에 표시합니다.') %></p>
+
+        <div class="d-flex align-items-center gap-2">
+          <button type="button" class="btn btn-primary btn-sm" id="pf-run">
+            <span class="spinner-border spinner-border-sm d-none" id="pf-spinner" role="status" aria-hidden="true"></span>
+            <span id="pf-run-label"><%= t('perf_run_btn', '실행') %></span>
+          </button>
+          <button type="button" class="btn btn-outline-secondary btn-sm" id="pf-clear"><%= t('perf_clear_btn', '결과 지우기') %></button>
+        </div>
+
+        <div class="alert alert-danger mt-3 d-none small" id="pf-error" role="alert">
+          <%= t('perf_error', '실행 실패:') %> <span id="pf-error-detail" class="font-monospace"></span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="col-lg-7">
+    <div class="card h-100">
+      <div class="card-body d-flex flex-column">
+        <h2 class="h5 card-title"><%= t('perf_results_title', '결과') %></h2>
+        <p class="card-text text-body-secondary small"><%= t('perf_results_desc', '실행할 때마다 맨 위에 한 줄씩 쌓입니다. 시간(ms)은 작을수록, RPS 는 클수록 좋습니다.') %></p>
+
+        <div class="table-responsive">
+          <table class="table table-sm table-striped align-middle small mb-0">
+            <thead>
+              <tr>
+                <th scope="col"><%= t('perf_col_scenario', '시나리오') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_iter', '반복') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_conc', '동시성') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_duration', '총시간(ms)') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_rps', 'RPS') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_avg', '평균(ms)') %></th>
+                <th scope="col" class="text-end">p50</th>
+                <th scope="col" class="text-end">p90</th>
+                <th scope="col" class="text-end">p95</th>
+                <th scope="col" class="text-end">p99</th>
+                <th scope="col" class="text-end"><%= t('perf_col_min', '최소') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_max', '최대') %></th>
+                <th scope="col" class="text-end"><%= t('perf_col_okfail', '성공/실패') %></th>
+              </tr>
+            </thead>
+            <tbody id="pf-results" data-empty="<%= t('perf_results_empty', '아직 실행한 결과가 없습니다.') %>">
+              <tr id="pf-empty"><td colspan="13" class="text-center text-body-secondary py-3"><%= t('perf_results_empty', '아직 실행한 결과가 없습니다.') %></td></tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<script src="/static/js/perf.js"></script>

package/sample/crud/apps/main/views/redis/index.ejs

@@ -0,0 +1,65 @@
+<% layout('layouts/main') %>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('redis_title', { defaultValue: 'Redis 데모' }) %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('redis_subtitle', { defaultValue: 'Redis 어댑터로 방문 카운터(원자적 INCR/EXPIRE)와 쿼리 결과 캐시(GET/SET/TTL/DEL)를 시연합니다.' }) %></p>
+</div>
+
+<% if (typeof notice !== 'undefined' && notice) { %>
+  <div class="alert alert-success alert-dismissible fade show" role="alert">
+    <%= notice %>
+    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="close"></button>
+  </div>
+<% } %>
+
+<div class="row g-3">
+  <div class="col-lg-6">
+    <div class="card h-100">
+      <div class="card-body">
+        <h2 class="h5 card-title"><%= t('redis_visits_title', { defaultValue: '방문 카운터' }) %></h2>
+        <p class="card-text text-body-secondary small"><%= t('redis_visits_desc', { defaultValue: '이 페이지를 열 때마다 카운터를 원자적으로 1씩 올립니다. 당일 카운터는 2일 후 자동 만료됩니다.' }) %></p>
+        <div class="d-flex gap-4 mt-3">
+          <div>
+            <div class="display-6 fw-bold"><%= visits.total %></div>
+            <div class="text-body-secondary small"><%= t('redis_visits_total', { defaultValue: '누적 방문' }) %></div>
+          </div>
+          <div>
+            <div class="display-6 fw-bold"><%= visits.today %></div>
+            <div class="text-body-secondary small"><%= t('redis_visits_today', { defaultValue: '오늘 방문' }) %> (<%= visits.date %>)</div>
+          </div>
+        </div>
+        <div class="mt-3"><code class="small">INCR · EXPIRE</code></div>
+      </div>
+    </div>
+  </div>
+
+  <div class="col-lg-6">
+    <div class="card h-100">
+      <div class="card-body d-flex flex-column">
+        <h2 class="h5 card-title"><%= t('redis_cache_title', { defaultValue: '쿼리 결과 캐시' }) %></h2>
+        <p class="card-text text-body-secondary small"><%= t('redis_cache_desc', { defaultValue: '사용자 수를 Redis 에 30초간 캐싱합니다. 캐시에 있으면 hit(SQL 미실행), 없으면 miss(SQL 재계산)입니다.' }) %></p>
+        <div class="d-flex align-items-center gap-3 mt-3">
+          <div class="display-6 fw-bold"><%= cacheState.value %></div>
+          <div>
+            <% if (cacheState.isHit) { %>
+              <span class="badge text-bg-success"><%= t('redis_cache_hit', { defaultValue: '캐시 적중' }) %></span>
+            <% } else { %>
+              <span class="badge text-bg-warning"><%= t('redis_cache_miss', { defaultValue: '캐시 미스' }) %></span>
+            <% } %>
+            <div class="text-body-secondary small mt-1">
+              <%= t('redis_cache_ttl', { defaultValue: '남은 TTL' }) %>: <%= cacheState.ttlSeconds %>s
+            </div>
+          </div>
+        </div>
+        <div class="mt-3"><code class="small">GET · SET EX · TTL · DEL</code></div>
+        <div class="mt-auto pt-3 d-flex gap-2">
+          <a href="/demo/redis" class="btn btn-outline-secondary btn-sm"><%= t('redis_cache_reload', { defaultValue: '다시 조회' }) %></a>
+          <form method="post" action="/demo/redis/clear" class="m-0">
+            <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+            <button type="submit" class="btn btn-outline-danger btn-sm"><%= t('redis_cache_clear', { defaultValue: '캐시 비우기' }) %></button>
+          </form>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

package/sample/crud/apps/main/views/tracing/index.ejs

@@ -0,0 +1,106 @@
+<% layout('layouts/main') %>
+<%
+  function fmt(d) { return new Date(d).toLocaleString('ko-KR', { hour12: false, timeZone: 'Asia/Seoul' }) }
+  function traceUrl(id) { return snap.zipkinBase + '/zipkin/traces/' + id }
+%>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('tracing_title', '분산 추적') %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('tracing_subtitle', '현재 요청의 trace_id 와 최근 trace 를 Zipkin 으로 잇습니다.') %></p>
+</div>
+
+<% if (typeof notice !== 'undefined' && notice) { %>
+  <div class="alert alert-success alert-dismissible fade show" role="alert">
+    <%= notice %>
+    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="close"></button>
+  </div>
+<% } %>
+
+<% if (!snap.enabled) { %>
+  <div class="alert alert-warning" role="alert"><%= t('tracing_disabled', '트레이싱이 비활성화되어 있습니다. .env 의 MEGA_OTEL_ENABLED=true 후 재시작하세요.') %></div>
+<% } %>
+
+<div class="row g-3">
+  <div class="col-lg-6">
+    <div class="card h-100">
+      <div class="card-body d-flex flex-column">
+        <h2 class="h5 card-title"><%= t('tracing_current_title', '현재 요청 trace') %></h2>
+        <p class="card-text text-body-secondary small"><%= t('tracing_current_desc', '이 페이지를 연 요청의 trace_id 입니다 (응답 헤더 x-trace-id 에도 실립니다).') %></p>
+        <% if (snap.current) { %>
+          <div class="mt-2">
+            <div class="text-body-secondary small"><%= t('tracing_trace_id', 'trace_id') %></div>
+            <code class="user-select-all d-block text-break"><%= snap.current.traceId %></code>
+            <div class="text-body-secondary small mt-2"><%= t('tracing_span_id', 'span_id') %></div>
+            <code class="user-select-all d-block text-break"><%= snap.current.spanId %></code>
+          </div>
+          <div class="mt-3">
+            <a class="btn btn-outline-primary btn-sm" href="<%= traceUrl(snap.current.traceId) %>" target="_blank" rel="noopener"><%= t('tracing_open_zipkin', 'Zipkin 에서 보기') %></a>
+          </div>
+        <% } else { %>
+          <p class="text-body-secondary small mb-0 mt-2"><%= t('tracing_no_current', '현재 trace 가 없습니다 (트레이싱 비활성).') %></p>
+        <% } %>
+        <div class="mt-auto pt-3">
+          <form method="post" action="/demo/tracing/generate" class="m-0">
+            <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+            <button type="submit" class="btn btn-primary btn-sm"><%= t('tracing_generate', 'trace 생성') %></button>
+          </form>
+          <p class="text-body-secondary small mb-0 mt-2"><%= t('tracing_generate_hint', '사용자 span 으로 DB 핑을 한 번 실행해 다층 span 트리를 만듭니다.') %></p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="col-lg-6">
+    <div class="card h-100">
+      <div class="card-body">
+        <h2 class="h5 card-title"><%= t('tracing_zipkin_title', 'Zipkin') %></h2>
+        <p class="card-text text-body-secondary small"><%= t('tracing_zipkin_desc', 'trace 는 OTLP→collector→Zipkin 으로 전달됩니다.') %></p>
+        <ul class="list-group list-group-flush mt-1">
+          <li class="list-group-item d-flex justify-content-between px-0">
+            <span><%= t('tracing_service', '서비스 이름') %></span><code class="font-monospace"><%= snap.serviceName %></code>
+          </li>
+          <li class="list-group-item d-flex justify-content-between px-0">
+            <span><%= t('tracing_ui', 'Zipkin UI') %></span>
+            <a href="<%= snap.zipkinBase %>" target="_blank" rel="noopener" class="font-monospace small"><%= snap.zipkinBase %></a>
+          </li>
+        </ul>
+        <p class="text-body-secondary small mt-3 mb-0"><%= t('tracing_export_hint', '전송에 약간의 지연이 있어, 생성 직후엔 Zipkin 에 잠시 뒤 나타납니다.') %></p>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="card mt-3">
+  <div class="card-body">
+    <h2 class="h5 card-title"><%= t('tracing_recent_title', '최근 trace') %></h2>
+    <p class="card-text text-body-secondary small"><%= t('tracing_recent_desc', '최근 기록된 trace_id 목록입니다.') %></p>
+    <% if (snap.recent.length === 0) { %>
+      <p class="text-body-secondary small mb-0"><%= t('tracing_recent_empty', '아직 기록된 trace 가 없습니다.') %></p>
+    <% } else { %>
+      <div class="table-responsive">
+        <table class="table table-sm align-middle mb-0">
+          <thead>
+            <tr>
+              <th scope="col"><%= t('tracing_recent_at', '시각') %></th>
+              <th scope="col"><%= t('tracing_recent_route', '라우트') %></th>
+              <th scope="col"><%= t('tracing_trace_id', 'trace_id') %></th>
+              <th scope="col"></th>
+            </tr>
+          </thead>
+          <tbody>
+            <% snap.recent.forEach(function (e) { %>
+              <tr>
+                <td class="font-monospace small"><%= fmt(e.at) %></td>
+                <td class="font-monospace small"><%= e.route %></td>
+                <td class="font-monospace small text-break"><%= e.traceId %></td>
+                <td class="text-end">
+                  <a class="btn btn-outline-secondary btn-sm" href="<%= traceUrl(e.traceId) %>" target="_blank" rel="noopener"><%= t('tracing_view', '보기') %></a>
+                </td>
+              </tr>
+            <% }) %>
+          </tbody>
+        </table>
+      </div>
+    <% } %>
+  </div>
+</div>