mega-framework 0.1.0

package/sample/crud/apps/main/views/auth/register.ejs

@@ -0,0 +1,71 @@
+<% layout('layouts/main') %>
+
+<div class="row justify-content-center">
+  <div class="col-md-6 col-lg-5">
+    <div class="card shadow-sm">
+      <div class="card-body p-4">
+        <h1 class="h4 mb-4 text-center"><%= t('register_title', '회원가입') %></h1>
+
+        <% if (typeof error !== 'undefined' && error) { %>
+          <div class="alert alert-danger" role="alert"><%= error %></div>
+        <% } %>
+
+        <form method="post" action="/register" novalidate>
+          <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+
+          <div class="mb-3">
+            <label for="name" class="form-label"><%= t('field_name', '이름') %></label>
+            <input
+              type="text"
+              class="form-control <%= invalid && invalid.name ? 'is-invalid' : '' %>"
+              id="name"
+              name="name"
+              value="<%= values && values.name ? values.name : '' %>"
+              placeholder="<%= t('field_name_ph', '예: 홍길동') %>"
+              autocomplete="name"
+              required
+            />
+            <div class="invalid-feedback"><%= t('field_name_required', '이름을 입력하세요.') %></div>
+          </div>
+
+          <div class="mb-3">
+            <label for="email" class="form-label"><%= t('field_email', '이메일') %></label>
+            <input
+              type="email"
+              class="form-control <%= invalid && invalid.email ? 'is-invalid' : '' %>"
+              id="email"
+              name="email"
+              value="<%= values && values.email ? values.email : '' %>"
+              placeholder="<%= t('field_email_ph', '예: hong@example.com') %>"
+              autocomplete="username"
+              required
+            />
+            <div class="invalid-feedback"><%= t('field_email_required', '올바른 이메일을 입력하세요.') %></div>
+          </div>
+
+          <div class="mb-4">
+            <label for="password" class="form-label"><%= t('field_password', '비밀번호') %></label>
+            <input
+              type="password"
+              class="form-control <%= invalid && invalid.password ? 'is-invalid' : '' %>"
+              id="password"
+              name="password"
+              autocomplete="new-password"
+              required
+            />
+            <div class="form-text <%= invalid && invalid.password ? 'text-danger' : '' %>"><%= t('field_password_hint', '최소 8자 이상 입력하세요.') %></div>
+          </div>
+
+          <div class="d-grid">
+            <button type="submit" class="btn btn-primary"><%= t('btn_register', '가입') %></button>
+          </div>
+        </form>
+
+        <p class="text-center text-body-secondary small mt-4 mb-0">
+          <%= t('register_have_account', '이미 계정이 있으신가요?') %>
+          <a href="/auth/login"><%= t('login_title', '로그인') %></a>
+        </p>
+      </div>
+    </div>
+  </div>
+</div>

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

@@ -0,0 +1,92 @@
+<% layout('layouts/main') %>
+<%
+  // 서버사이드 시각 포맷 헬퍼 — 스케줄 타임존 기준 24시간제. nextRuns 는 Date, history.at 은 ISO 문자열.
+  function fmt(d) { return new Date(d).toLocaleString('ko-KR', { hour12: false, timeZone: snap.timezone }) }
+  function sourceBadge(s) { return s === 'manual' ? 'text-bg-secondary' : 'text-bg-primary' }
+%>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('cron_title', { defaultValue: '스케줄러 데모 (MegaSchedule)' }) %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('cron_subtitle', { defaultValue: 'mega scheduler 프로세스가 30초마다 Redis 카운터를 원자적으로 올립니다. 다중 인스턴스 중복 실행은 분산 락(redlock leader election)으로 막습니다.' }) %></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 d-flex flex-column">
+        <h2 class="h5 card-title"><%= t('cron_counter_title', { defaultValue: '실행 카운터' }) %></h2>
+        <p class="card-text text-body-secondary small"><%= t('cron_counter_desc', { defaultValue: '스케줄이 돌 때마다(또는 아래 수동 실행) Redis 카운터를 1씩 올립니다.' }) %></p>
+        <div class="display-5 fw-bold mt-2"><%= snap.count %></div>
+        <div class="text-body-secondary small"><%= t('cron_counter_total', { defaultValue: '누적 실행 횟수' }) %></div>
+        <div class="mt-3">
+          <code class="small"><%= snap.cron %></code>
+          <span class="badge text-bg-light ms-1"><%= snap.timezone %></span>
+        </div>
+        <div class="mt-auto pt-3">
+          <form method="post" action="/demo/cron/run" class="m-0">
+            <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+            <button type="submit" class="btn btn-primary btn-sm"><%= t('cron_run_now', { defaultValue: '지금 실행' }) %></button>
+          </form>
+          <p class="text-body-secondary small mb-0 mt-2"><%= t('cron_run_hint', { defaultValue: 'cron 시각을 기다리지 않고 같은 작업을 즉시 1회 실행합니다(수동 트리거).' }) %></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('cron_next_title', { defaultValue: '다음 실행 시각' }) %></h2>
+        <p class="card-text text-body-secondary small"><%= t('cron_next_desc', { defaultValue: 'croner 가 계산한 다음 다섯 번의 실행 예정 시각입니다(타이머 미가동 순수 계산).' }) %></p>
+        <ul class="list-group list-group-flush mt-2">
+          <% snap.nextRuns.forEach(function (run, i) { %>
+            <li class="list-group-item d-flex justify-content-between align-items-center px-0">
+              <span class="font-monospace small"><%= fmt(run) %></span>
+              <% if (i === 0) { %><span class="badge text-bg-success"><%= t('cron_next_soonest', { defaultValue: '가장 가까움' }) %></span><% } %>
+            </li>
+          <% }) %>
+        </ul>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="card mt-3">
+  <div class="card-body">
+    <h2 class="h5 card-title"><%= t('cron_history_title', { defaultValue: '최근 실행 이력' }) %></h2>
+    <p class="card-text text-body-secondary small"><%= t('cron_history_desc', { defaultValue: 'Redis LIST 에 최근 10건을 남깁니다(LPUSH + LTRIM). 자동 실행과 수동 실행이 함께 쌓입니다.' }) %></p>
+    <% if (snap.history.length === 0) { %>
+      <p class="text-body-secondary small mb-0"><%= t('cron_history_empty', { defaultValue: '아직 실행 이력이 없습니다. scheduler 프로세스를 켜거나 위에서 수동 실행해 보세요.' }) %></p>
+    <% } else { %>
+      <div class="table-responsive">
+        <table class="table table-sm align-middle mb-0">
+          <thead>
+            <tr>
+              <th scope="col">#</th>
+              <th scope="col"><%= t('cron_history_at', { defaultValue: '실행 시각' }) %></th>
+              <th scope="col"><%= t('cron_history_source', { defaultValue: '출처' }) %></th>
+            </tr>
+          </thead>
+          <tbody>
+            <% snap.history.forEach(function (e) { %>
+              <tr>
+                <td class="font-monospace"><%= e.count %></td>
+                <td class="font-monospace small"><%= fmt(e.at) %></td>
+                <td>
+                  <span class="badge <%= sourceBadge(e.source) %>"><%= t('cron_source_' + e.source) %></span>
+                </td>
+              </tr>
+            <% }) %>
+          </tbody>
+        </table>
+      </div>
+    <% } %>
+  </div>
+</div>

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

@@ -0,0 +1,24 @@
+<% layout('layouts/main') %>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('guide_index_title', '가이드') %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('guide_index_subtitle', 'MEGA-FRAMEWORK 사용 가이드 모음입니다.') %></p>
+</div>
+
+<div class="alert alert-secondary d-flex align-items-start gap-2" role="alert">
+  <span>📚</span>
+  <div><%= t('guide_index_welcome', '각 주제별 가이드를 골라 읽어보세요. 코드 예시는 서버에서 미리 하이라이트되어 표시됩니다.') %></div>
+</div>
+
+<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-3 mt-1">
+  <% guides.forEach(function (g, i) { %>
+    <div class="col">
+      <a href="/guide/<%= g.slug %>" class="card h-100 text-decoration-none text-reset">
+        <div class="card-body">
+          <div class="text-body-secondary small mb-1">#<%= String(i + 1).padStart(2, '0') %></div>
+          <h2 class="h6 card-title mb-0"><%= g.title %></h2>
+        </div>
+      </a>
+    </div>
+  <% }) %>
+</div>

package/sample/crud/apps/main/views/guide/page.ejs

@@ -0,0 +1,64 @@
+<% layout('layouts/main') %>
+<% block('head', '<link rel="stylesheet" href="/static/vendor/highlight/github.css" />') %>
+<% block('head', '<link rel="stylesheet" href="/static/vendor/highlight/github-dark.css" />') %>
+<% block('head', '<link rel="stylesheet" href="/static/css/guide.css" />') %>
+
+<%
+  // 목차(가이드 목록) 마크업 — 데스크톱 사이드바와 모바일 offcanvas 가 공유한다. EJS 함수 안의 HTML 은
+  // 호출 시점에 출력 버퍼로 append 되므로, 정의 후 두 곳에서 호출하면 중복 없이 같은 마크업을 낸다.
+  function renderToc() {
+%>
+  <ul class="nav flex-column guide-toc">
+    <% guides.forEach(function (g) { %>
+      <li class="nav-item">
+        <a
+          class="nav-link<%= g.slug === guide.slug ? ' active' : '' %>"
+          href="/guide/<%= g.slug %>"
+          ><%= g.title %></a
+        >
+      </li>
+    <% }) %>
+  </ul>
+<% } %>
+
+<div class="d-lg-none mb-3">
+  <button
+    class="btn btn-outline-secondary btn-sm"
+    type="button"
+    data-bs-toggle="offcanvas"
+    data-bs-target="#guideToc"
+    aria-controls="guideToc"
+  >
+    ☰ <%= t('guide_toc', '목차') %>
+  </button>
+</div>
+
+<div class="row g-4">
+  <div class="col-lg-3 d-none d-lg-block">
+    <nav class="guide-sidebar" aria-label="<%= t('guide_toc', '목차') %>">
+      <div class="text-body-secondary small text-uppercase fw-semibold mb-2"><%= t('guide_toc', '목차') %></div>
+      <% renderToc() %>
+    </nav>
+  </div>
+
+  <div class="col-lg-9">
+    <article class="guide-content">
+      <%- guide.html %>
+    </article>
+    <div class="mt-4 pt-3 border-top">
+      <a href="/guide" class="btn btn-outline-secondary btn-sm">← <%= t('guide_back', '목록으로') %></a>
+    </div>
+  </div>
+</div>
+
+<div class="offcanvas offcanvas-start" tabindex="-1" id="guideToc" aria-labelledby="guideTocLabel">
+  <div class="offcanvas-header">
+    <h2 class="offcanvas-title h6 mb-0" id="guideTocLabel"><%= t('guide_toc', '목차') %></h2>
+    <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="close"></button>
+  </div>
+  <div class="offcanvas-body">
+    <nav class="guide-sidebar">
+      <% renderToc() %>
+    </nav>
+  </div>
+</div>

package/sample/crud/apps/main/views/home.ejs

@@ -0,0 +1,82 @@
+<% layout('layouts/main') %>
+
+<section class="hero p-4 p-md-5 mb-5">
+  <div class="row align-items-center g-4">
+    <div class="col-lg-7">
+      <span class="badge text-bg-light border mb-3">sample / crud</span>
+      <h1 class="display-5 fw-bold mb-3"><%= t('home_title', '사용자 CRUD 관리') %></h1>
+      <p class="fs-5 text-body-secondary mb-4"><%= t('home_subtitle', 'postgres 기반 사용자 리소스를 Bootstrap 5 관리 UI 로 생성·조회·수정·삭제합니다. 같은 서비스 계층을 JSON REST API 도 함께 노출합니다.') %></p>
+      <div class="d-flex flex-wrap gap-2">
+        <a href="/admin/users" class="btn btn-primary btn-lg"><%= t('home_cta_manage', '사용자 관리') %></a>
+        <a href="/users" class="btn btn-outline-secondary btn-lg" target="_blank" rel="noopener"
+          ><%= t('home_cta_api', 'JSON API (/users)') %></a
+        >
+      </div>
+    </div>
+    <div class="col-lg-5 text-center d-none d-lg-block">
+      <div class="display-1">🗂️</div>
+    </div>
+  </div>
+</section>
+
+<div class="alert alert-secondary d-flex align-items-start gap-2" role="alert">
+  <span>ℹ️</span>
+  <div><%= t('home_api_note', '모든 요청은 정본 계층 흐름을 따릅니다:') %> <code>route → controller → service → model → postgres</code></div>
+</div>
+
+<div class="row row-cols-1 row-cols-md-2 g-3 mt-2">
+  <div class="col">
+    <a href="/demo/notes" class="card h-100 text-decoration-none text-reset">
+      <div class="card-body">
+        <div class="fs-2 mb-2">📝</div>
+        <h2 class="h5 card-title"><%= t('home_demo_notes', 'Mongo 노트 데모') %></h2>
+        <p class="card-text text-body-secondary small mb-0"><%= t('notes_subtitle', 'MongoDB 도큐먼트 어댑터로 notes 컬렉션을 생성·조회·수정·삭제합니다.') %></p>
+      </div>
+    </a>
+  </div>
+  <div class="col">
+    <a href="/demo/redis" class="card h-100 text-decoration-none text-reset">
+      <div class="card-body">
+        <div class="fs-2 mb-2">⚡</div>
+        <h2 class="h5 card-title"><%= t('home_demo_redis', 'Redis 캐시 데모') %></h2>
+        <p class="card-text text-body-secondary small mb-0"><%= t('redis_subtitle', 'Redis 어댑터로 방문 카운터(원자적 INCR/EXPIRE)와 쿼리 결과 캐시(GET/SET/TTL/DEL)를 시연합니다.') %></p>
+      </div>
+    </a>
+  </div>
+  <div class="col">
+    <a href="/demo/ws" class="card h-100 text-decoration-none text-reset">
+      <div class="card-body">
+        <div class="fs-2 mb-2">💬</div>
+        <h2 class="h5 card-title"><%= t('home_demo_ws', 'WebSocket 채팅 데모') %></h2>
+        <p class="card-text text-body-secondary small mb-0"><%= t('ws_subtitle', 'WASM MegaSocket 으로 /ws/chat 에 접속합니다. 메시지는 ASP 로 암호화(E: 프레임)되어 브라우저에서 직접 암복호화되고, 서버는 채널 전체에 broadcast 합니다.') %></p>
+      </div>
+    </a>
+  </div>
+  <div class="col">
+    <a href="/demo/cron" class="card h-100 text-decoration-none text-reset">
+      <div class="card-body">
+        <div class="fs-2 mb-2">⏰</div>
+        <h2 class="h5 card-title"><%= t('home_demo_cron', '스케줄러 데모') %></h2>
+        <p class="card-text text-body-secondary small mb-0"><%= t('cron_subtitle', 'mega scheduler 프로세스가 30초마다 Redis 카운터를 원자적으로 올립니다. 다중 인스턴스 중복 실행은 분산 락(redlock leader election)으로 막습니다.') %></p>
+      </div>
+    </a>
+  </div>
+  <div class="col">
+    <a href="/demo/jobs" class="card h-100 text-decoration-none text-reset">
+      <div class="card-body">
+        <div class="fs-2 mb-2">📮</div>
+        <h2 class="h5 card-title"><%= t('home_demo_jobs', '잡 큐 데모') %></h2>
+        <p class="card-text text-body-secondary small mb-0"><%= t('jobs_subtitle', 'EmailJob 을 NATS JetStream 에 enqueue 하면 mega worker 프로세스가 소비합니다. 일시 실패는 재시도되고, 영구 실패는 DLQ 로 격리됩니다.') %></p>
+      </div>
+    </a>
+  </div>
+  <div class="col">
+    <a href="/demo/worker" class="card h-100 text-decoration-none text-reset">
+      <div class="card-body">
+        <div class="fs-2 mb-2">🧵</div>
+        <h2 class="h5 card-title"><%= t('home_demo_worker', 'CPU 워커 데모') %></h2>
+        <p class="card-text text-body-secondary small mb-0"><%= t('worker_subtitle', 'SHA-256 N회 반복 같은 CPU-bound 작업을 worker_threads 풀에서 돌립니다. 계산 도중에도 서버가 다른 요청에 즉시 응답하는지(메인 스레드 non-block) 하트비트로 확인합니다.') %></p>
+      </div>
+    </a>
+  </div>
+</div>

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

@@ -0,0 +1,113 @@
+<% layout('layouts/main') %>
+<%
+  function fmt(d) { return new Date(d).toLocaleString('ko-KR', { hour12: false }) }
+  function statusBadge(s) { return s === 'sent' ? 'text-bg-success' : (s === 'retry' ? 'text-bg-warning' : 'text-bg-danger') }
+  function modeBadge(m) { return m === 'ok' ? 'text-bg-success' : (m === 'flaky' ? 'text-bg-warning' : 'text-bg-danger') }
+%>
+
+<div class="mb-4">
+  <h1 class="h3 mb-1"><%= t('jobs_title', { defaultValue: '잡 큐 데모 (MegaJob)' }) %></h1>
+  <p class="text-body-secondary small mb-0"><%= t('jobs_subtitle', { defaultValue: 'EmailJob 을 NATS JetStream 에 enqueue 하면 mega worker 프로세스가 소비합니다. 일시 실패는 재시도되고, 영구 실패는 DLQ 로 격리됩니다.' }) %></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('jobs_enqueue_title', { defaultValue: '이메일 발송 잡 넣기' }) %></h2>
+        <p class="card-text text-body-secondary small"><%= t('jobs_enqueue_desc', { defaultValue: '실제 발송은 하지 않고 처리만 시뮬레이션합니다. 모드로 성공/재시도/영구실패 흐름을 시연합니다.' }) %></p>
+        <form method="post" action="/demo/jobs/enqueue" class="mt-3">
+          <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
+          <div class="mb-3">
+            <label for="to" class="form-label small"><%= t('jobs_field_to', { defaultValue: '받는 사람' }) %></label>
+            <input type="email" class="form-control form-control-sm" id="to" name="to" placeholder="demo@example.com" />
+          </div>
+          <div class="mb-3">
+            <label for="mode" class="form-label small"><%= t('jobs_field_mode', { defaultValue: '모드' }) %></label>
+            <select class="form-select form-select-sm" id="mode" name="mode">
+              <% modes.forEach(function (m) { %>
+                <option value="<%= m %>"><%= t('jobs_mode_' + m) %></option>
+              <% }) %>
+            </select>
+            <div class="form-text small">
+              <%= t('jobs_mode_ok', { defaultValue: '성공' }) %>: <%= t('jobs_mode_ok_hint', { defaultValue: '첫 시도에 바로 성공' }) %><br />
+              <%= t('jobs_mode_flaky', { defaultValue: '재시도' }) %>: <%= t('jobs_mode_flaky_hint', { defaultValue: '1번째 시도 실패 → 재시도 → 2번째 성공' }) %><br />
+              <%= t('jobs_mode_fail', { defaultValue: '영구 실패' }) %>: <%= t('jobs_mode_fail_hint', { defaultValue: '매 시도 실패 → 재시도 소진 후 DLQ 격리' }) %>
+            </div>
+          </div>
+          <button type="submit" class="btn btn-primary btn-sm"><%= t('jobs_enqueue_btn', { defaultValue: '큐에 넣기' }) %></button>
+          <a href="/demo/jobs" class="btn btn-outline-secondary btn-sm ms-1"><%= t('jobs_reload', { defaultValue: '새로고침' }) %></a>
+        </form>
+      </div>
+    </div>
+  </div>
+
+  <div class="col-lg-7">
+    <div class="card h-100">
+      <div class="card-body">
+        <h2 class="h5 card-title">
+          <%= t('jobs_dlq_title', { defaultValue: 'DLQ (격리된 잡)' }) %>
+          <span class="badge <%= dlq.count > 0 ? 'text-bg-danger' : 'text-bg-light' %> ms-1"><%= dlq.count %></span>
+        </h2>
+        <p class="card-text text-body-secondary small"><%= t('jobs_dlq_desc', { defaultValue: '재시도를 모두 소진한 영구 실패 잡이 모이는 곳입니다(NATS 스트림). 원인 분석·재처리용.' }) %></p>
+        <% if (dlq.count === 0) { %>
+          <p class="text-body-secondary small mb-0"><%= t('jobs_dlq_empty', { defaultValue: '아직 DLQ 로 간 잡이 없습니다.' }) %></p>
+        <% } else if (dlq.latest) { %>
+          <dl class="row small mb-0 mt-2">
+            <dt class="col-sm-4"><%= t('jobs_dlq_failed_at', { defaultValue: '실패 시각' }) %></dt>
+            <dd class="col-sm-8 font-monospace"><%= fmt(dlq.latest.failedAt) %></dd>
+            <dt class="col-sm-4"><%= t('jobs_dlq_deliveries', { defaultValue: '전달 횟수' }) %></dt>
+            <dd class="col-sm-8 font-monospace"><%= dlq.latest.deliveryCount %></dd>
+            <dt class="col-sm-4"><%= t('jobs_dlq_error', { defaultValue: '오류' }) %></dt>
+            <dd class="col-sm-8"><code class="small"><%= dlq.latest.error %></code></dd>
+            <dt class="col-sm-4"><%= t('jobs_dlq_payload', { defaultValue: '페이로드' }) %></dt>
+            <dd class="col-sm-8 font-monospace small"><%= JSON.stringify(dlq.latest.payload) %></dd>
+          </dl>
+        <% } %>
+        <div class="mt-3"><code class="small">NATS JetStream · workqueue → DLQ</code></div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="card mt-3">
+  <div class="card-body">
+    <h2 class="h5 card-title"><%= t('jobs_events_title', { defaultValue: '처리 이벤트' }) %></h2>
+    <p class="card-text text-body-secondary small"><%= t('jobs_events_desc', { defaultValue: '워커가 각 시도마다 남긴 타임라인입니다(최신순). 재시도가 일어나면 같은 잡이 여러 번 보입니다.' }) %></p>
+    <% if (events.length === 0) { %>
+      <p class="text-body-secondary small mb-0"><%= t('jobs_events_empty', { defaultValue: '아직 처리된 잡이 없습니다. 위에서 잡을 넣고 mega worker 프로세스를 켜 보세요.' }) %></p>
+    <% } else { %>
+      <div class="table-responsive">
+        <table class="table table-sm align-middle mb-0">
+          <thead>
+            <tr>
+              <th scope="col"><%= t('jobs_events_at', { defaultValue: '시각' }) %></th>
+              <th scope="col"><%= t('jobs_events_id', { defaultValue: '잡 ID' }) %></th>
+              <th scope="col"><%= t('jobs_field_mode', { defaultValue: '모드' }) %></th>
+              <th scope="col"><%= t('jobs_events_attempt', { defaultValue: '시도' }) %></th>
+              <th scope="col"><%= t('jobs_events_status', { defaultValue: '상태' }) %></th>
+            </tr>
+          </thead>
+          <tbody>
+            <% events.forEach(function (e) { %>
+              <tr>
+                <td class="font-monospace small"><%= fmt(e.at) %></td>
+                <td class="font-monospace small"><%= e.id %></td>
+                <td><span class="badge <%= modeBadge(e.mode) %>"><%= t('jobs_mode_' + e.mode) %></span></td>
+                <td class="font-monospace"><%= e.attempt %></td>
+                <td><span class="badge <%= statusBadge(e.status) %>"><%= t('jobs_status_' + e.status) %></span></td>
+              </tr>
+            <% }) %>
+          </tbody>
+        </table>
+      </div>
+    <% } %>
+  </div>
+</div>

package/sample/crud/apps/main/views/layouts/main.ejs

@@ -0,0 +1,112 @@
+<!doctype html>
+<html lang="<%= lang %>" data-bs-theme="light">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title><%= typeof title !== 'undefined' ? title : 'sample-crud' %></title>
+    <%# FOUC 방지 — 저장된 테마를 페인트 전에 적용. CSP(script-src 'self')라 인라인 불가 → 외부 파일. %>
+    <script src="/static/js/theme-init.js"></script>
+    <link rel="stylesheet" href="/static/vendor/bootstrap/bootstrap.min.css" />
+    <link rel="stylesheet" href="/static/css/app.css" />
+    <%# 페이지별 추가 head(가이드 뷰어가 highlight.js·가이드 CSS 를 여기에 주입한다, ejs-mate block). %>
+    <%- block('head') %>
+  </head>
+  <body class="d-flex flex-column min-vh-100">
+    <nav class="navbar navbar-expand-md border-bottom">
+      <div class="container">
+        <a class="navbar-brand" href="/">MEGA<span class="brand-dot">·</span>crud</a>
+        <button
+          class="navbar-toggler"
+          type="button"
+          data-bs-toggle="collapse"
+          data-bs-target="#navmenu"
+          aria-controls="navmenu"
+          aria-expanded="false"
+          aria-label="menu"
+        >
+          <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navmenu">
+          <ul class="navbar-nav me-auto">
+            <li class="nav-item"><a class="nav-link" href="/"><%= t('nav_home', '홈') %></a></li>
+            <li class="nav-item"><a class="nav-link" href="/admin/users"><%= t('nav_users', '사용자') %></a></li>
+            <li class="nav-item dropdown">
+              <a
+                class="nav-link dropdown-toggle"
+                href="#"
+                role="button"
+                data-bs-toggle="dropdown"
+                aria-expanded="false"
+                ><%= t('nav_demo', '데모') %></a
+              >
+              <ul class="dropdown-menu">
+                <li><a class="dropdown-item" href="/demo/notes"><%= t('nav_notes', '노트 (Mongo)') %></a></li>
+                <li><a class="dropdown-item" href="/demo/redis"><%= t('nav_redis', '캐시 (Redis)') %></a></li>
+                <li><a class="dropdown-item" href="/demo/ws"><%= t('nav_ws', '채팅 (WS+ASP)') %></a></li>
+                <li><a class="dropdown-item" href="/demo/cron"><%= t('nav_cron', '스케줄러 (Cron)') %></a></li>
+                <li><a class="dropdown-item" href="/demo/jobs"><%= t('nav_jobs', '잡 큐 (NATS)') %></a></li>
+                <li><a class="dropdown-item" href="/demo/worker"><%= t('nav_worker', '워커 (Threads)') %></a></li>
+                <li><hr class="dropdown-divider" /></li>
+                <li><a class="dropdown-item" href="/demo/metrics"><%= t('nav_metrics', '메트릭') %></a></li>
+                <li><a class="dropdown-item" href="/demo/tracing"><%= t('nav_tracing', '트레이싱') %></a></li>
+                <li><a class="dropdown-item" href="/demo/logs"><%= t('nav_logs', '로그') %></a></li>
+                <li><a class="dropdown-item" href="/demo/upload"><%= t('nav_upload', '업로드') %></a></li>
+              </ul>
+            </li>
+            <li class="nav-item"><a class="nav-link" href="/perf"><%= t('nav_perf', '성능') %></a></li>
+            <li class="nav-item"><a class="nav-link" href="/guide"><%= t('nav_guide', '가이드') %></a></li>
+            <li class="nav-item"><a class="nav-link" href="/docs"><%= t('nav_docs', 'API 문서') %></a></li>
+          </ul>
+          <div class="d-flex align-items-center gap-2">
+            <% var _user = typeof currentUser !== 'undefined' ? currentUser : null %>
+            <% if (_user) { %>
+              <span class="navbar-text small"><%= _user.name %></span>
+              <form method="post" action="/auth/logout" class="m-0">
+                <input type="hidden" name="_csrf" value="<%= typeof csrfToken !== 'undefined' ? csrfToken : '' %>" />
+                <button type="submit" class="btn btn-outline-secondary btn-sm"><%= t('btn_logout', '로그아웃') %></button>
+              </form>
+            <% } else { %>
+              <a class="btn btn-outline-primary btn-sm" href="/auth/login"><%= t('btn_login', '로그인') %></a>
+            <% } %>
+            <button
+              type="button"
+              class="btn btn-outline-secondary btn-sm"
+              data-theme-toggle
+              aria-label="<%= t('theme_toggle', '테마 전환') %>"
+              title="<%= t('theme_toggle', '테마 전환') %>"
+            >
+              <span class="theme-icon-light">☀️</span><span class="theme-icon-dark">🌙</span>
+            </button>
+            <div class="dropdown">
+              <button
+                class="btn btn-outline-secondary btn-sm dropdown-toggle"
+                type="button"
+                data-bs-toggle="dropdown"
+                aria-expanded="false"
+              >
+                <%= lang === 'ko' ? '한국어' : 'English' %>
+              </button>
+              <ul class="dropdown-menu dropdown-menu-end">
+                <li><a class="dropdown-item" href="#" data-lang="ko">한국어</a></li>
+                <li><a class="dropdown-item" href="#" data-lang="en">English</a></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </nav>
+
+    <main class="container py-4 py-md-5 flex-grow-1">
+      <%- body %>
+    </main>
+
+    <footer class="site-footer py-4 mt-auto">
+      <div class="container text-center text-body-secondary small">
+        <%= t('footer_built', 'MEGA-FRAMEWORK 로 제작 · Bootstrap 5') %>
+      </div>
+    </footer>
+
+    <script src="/static/vendor/bootstrap/bootstrap.bundle.min.js"></script>
+    <script src="/static/js/app.js"></script>
+  </body>
+</html>