diff --git a/apps/pyconkr-admin/src/components/pages/external_api/google_oauth2_editor.tsx b/apps/pyconkr-admin/src/components/pages/external_api/google_oauth2_editor.tsx
new file mode 100644
index 0000000..5358720
--- /dev/null
+++ b/apps/pyconkr-admin/src/components/pages/external_api/google_oauth2_editor.tsx
@@ -0,0 +1,105 @@
+import { useBackendAdminClient, useIssueGoogleOAuth2AccessTokenMutation } from "@frontend/common/src/hooks/useAdminAPI";
+import { GoogleOAuth2AccessTokenResponseSchema } from "@frontend/common/src/schemas/backendAdminAPI";
+import { VpnKey } from "@mui/icons-material";
+import { Box, Button, Stack, Table, TableBody, TableCell, TableHead, TableRow, Typography } from "@mui/material";
+import * as React from "react";
+import { useParams } from "react-router-dom";
+
+import { addErrorSnackbar, addSnackbar } from "../../../utils/snackbar";
+import { AdminEditor } from "../../layouts/admin_editor";
+
+type CachedToken = { issuedAt: number; response: GoogleOAuth2AccessTokenResponseSchema };
+type TokenState = { issuedAt: Date; response: GoogleOAuth2AccessTokenResponseSchema };
+
+const LOCAL_STORAGE_KEY_PREFIX = "googleoauth2-access-token-";
+
+const buildLocalStorageKey = (id: string) => `${LOCAL_STORAGE_KEY_PREFIX}${id}`;
+
+const loadCachedToken = (id: string): TokenState | null => {
+  try {
+    const raw = window.localStorage.getItem(buildLocalStorageKey(id));
+    if (!raw) return null;
+    const parsed = JSON.parse(raw) as CachedToken;
+    const expiryMs = parsed.issuedAt + (parsed.response.expires_in ?? 0) * 1000;
+    if (expiryMs <= Date.now()) {
+      window.localStorage.removeItem(buildLocalStorageKey(id));
+      return null;
+    }
+    return { issuedAt: new Date(parsed.issuedAt), response: parsed.response };
+  } catch {
+    return null;
+  }
+};
+
+export const AdminGoogleOAuth2Editor: React.FC = () => {
+  const { id } = useParams<{ id?: string }>();
+  const backendAdminClient = useBackendAdminClient();
+  const [tokenState, setTokenState] = React.useState<TokenState | null>(() => (id ? loadCachedToken(id) : null));
+
+  const accessTokenMutation = useIssueGoogleOAuth2AccessTokenMutation(backendAdminClient, id ?? "");
+
+  const handleIssueToken = () => {
+    if (!id || accessTokenMutation.isPending) return;
+    accessTokenMutation.mutate(undefined, {
+      onSuccess: (response) => {
+        const issuedAt = new Date();
+        setTokenState({ issuedAt, response });
+        window.localStorage.setItem(buildLocalStorageKey(id), JSON.stringify({ issuedAt: issuedAt.getTime(), response }));
+        addSnackbar("Access Token을 발급했습니다.", "success");
+      },
+      onError: addErrorSnackbar,
+    });
+  };
+
+  const renderValue = (key: string, value: unknown): React.ReactNode => {
+    if (Array.isArray(value)) {
+      return (
+        <Box component="ul" sx={{ m: 0, pl: 2 }}>
+          {value.map((v, idx) => (
+            <li key={idx}>{String(v)}</li>
+          ))}
+        </Box>
+      );
+    }
+    if (value == null) return "";
+    if (key === "expires_in" && typeof value === "number" && tokenState) {
+      return new Date(tokenState.issuedAt.getTime() + value * 1000).toLocaleString();
+    }
+    return String(value);
+  };
+
+  return (
+    <AdminEditor app="external-api/google" resource="oauth2" id={id}>
+      {id && (
+        <Stack spacing={2} sx={{ my: 2 }}>
+          <Button variant="outlined" color="primary" onClick={handleIssueToken} disabled={accessTokenMutation.isPending} startIcon={<VpnKey />}>
+            Access Token 발급
+          </Button>
+          {tokenState && (
+            <Box>
+              <Typography variant="subtitle2" sx={{ mb: 1 }}>
+                발급 결과
+              </Typography>
+              <Table size="small">
+                <TableHead>
+                  <TableRow>
+                    <TableCell sx={{ width: "30%" }}>필드</TableCell>
+                    <TableCell>값</TableCell>
+                  </TableRow>
+                </TableHead>
+                <TableBody>
+                  {Object.entries(tokenState.response).map(([key, value]) => (
+                    <TableRow key={key}>
+                      <TableCell>{key}</TableCell>
+                      <TableCell sx={{ wordBreak: "break-all" }}>{renderValue(key, value)}</TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </Box>
+          )}
+        </Stack>
+      )}
+    </AdminEditor>
+  );
+};
diff --git a/apps/pyconkr-admin/src/components/pages/notification/email_template_editor.tsx b/apps/pyconkr-admin/src/components/pages/notification/email_template_editor.tsx
new file mode 100644
index 0000000..17ce1d3
--- /dev/null
+++ b/apps/pyconkr-admin/src/components/pages/notification/email_template_editor.tsx
@@ -0,0 +1,204 @@
+import {
+  useBackendAdminClient,
+  useCreateMutation,
+  useRenderTemplateMutation,
+  useRetrieveQuery,
+  useUpdateMutation,
+} from "@frontend/common/src/hooks/useAdminAPI";
+import { Add, Close, Save, Visibility } from "@mui/icons-material";
+import { Box, Button, Chip, CircularProgress, IconButton, Stack, TextField, Typography } from "@mui/material";
+import { ErrorBoundary, Suspense } from "@suspensive/react";
+import * as React from "react";
+import { useNavigate, useParams } from "react-router-dom";
+
+import { addErrorSnackbar, addSnackbar } from "../../../utils/snackbar";
+import { BackendAdminSignInGuard } from "../../elements/admin_signin_guard";
+import { ErrorFallback } from "../../elements/error_fallback";
+
+const APP = "notification/email";
+const RESOURCE = "template";
+
+type EmailTemplateFormData = {
+  code: string;
+  title: string;
+  description: string;
+  data: string;
+  sent_from: string;
+};
+
+type EmailTemplateSchema = EmailTemplateFormData & {
+  id: string;
+  created_at: string;
+  created_by: string | null;
+  updated_at: string;
+  updated_by: string | null;
+  deleted_at: string | null;
+  deleted_by: string | null;
+  str_repr: string;
+  template_variables: string[];
+};
+
+const isValidJson = (s: string): boolean => {
+  if (!s.trim()) return true;
+  try {
+    JSON.parse(s);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+const InnerAdminEmailTemplateEditor: React.FC = ErrorBoundary.with(
+  { fallback: ErrorFallback },
+  Suspense.with({ fallback: <CircularProgress /> }, () => {
+    const navigate = useNavigate();
+    const { id } = useParams<{ id?: string }>();
+    const backendAdminClient = useBackendAdminClient();
+    const { data: retrievedData } = useRetrieveQuery<EmailTemplateSchema>(backendAdminClient, APP, RESOURCE, id || "");
+
+    const [formData, setFormData] = React.useState<EmailTemplateFormData>(() => ({
+      code: retrievedData?.code ?? "",
+      title: retrievedData?.title ?? "",
+      description: retrievedData?.description ?? "",
+      data: retrievedData?.data ?? "",
+      sent_from: retrievedData?.sent_from ?? "",
+    }));
+    const [contextJson, setContextJson] = React.useState("{}");
+
+    const createMutation = useCreateMutation<EmailTemplateFormData>(backendAdminClient, APP, RESOURCE);
+    const updateMutation = useUpdateMutation<EmailTemplateFormData>(backendAdminClient, APP, RESOURCE, id || "");
+    const renderMutation = useRenderTemplateMutation(backendAdminClient, APP, RESOURCE);
+
+    const setField = <K extends keyof EmailTemplateFormData>(key: K, value: EmailTemplateFormData[K]) => setFormData((p) => ({ ...p, [key]: value }));
+    const onClose = () => navigate(`/${APP}/${RESOURCE}`);
+
+    const isPending = createMutation.isPending || updateMutation.isPending;
+    const jsonValid = isValidJson(contextJson);
+
+    const handleSubmit = () => {
+      if (isPending) return;
+      if (id) {
+        updateMutation.mutate(formData, {
+          onSuccess: () => addSnackbar("수정했습니다.", "success"),
+          onError: addErrorSnackbar,
+        });
+      } else {
+        createMutation.mutate(formData, {
+          onSuccess: (data) => {
+            addSnackbar("생성했습니다.", "success");
+            const newId = (data as EmailTemplateFormData & { id?: string }).id;
+            if (newId) navigate(`/${APP}/${RESOURCE}/${newId}`);
+          },
+          onError: addErrorSnackbar,
+        });
+      }
+    };
+
+    const handlePreview = () => {
+      if (!id || renderMutation.isPending || !jsonValid) return;
+      const context = contextJson.trim() ? JSON.parse(contextJson) : {};
+      renderMutation.mutate({ id, context });
+    };
+
+    const title = `${APP.toUpperCase()} > ${RESOURCE.toUpperCase()} > ${id ? "편집: " + id : "새 객체 추가"}`;
+
+    return (
+      <Box sx={{ flexGrow: 1, width: "100%", minHeight: "100%" }}>
+        <Stack direction="row" justifyContent="space-between">
+          <Typography variant="h5">{title}</Typography>
+          <IconButton onClick={onClose} children={<Close />} />
+        </Stack>
+        <Stack spacing={2} sx={{ my: 2 }}>
+          <TextField label="code" value={formData.code} onChange={(e) => setField("code", e.target.value)} fullWidth />
+          <TextField label="title" value={formData.title} onChange={(e) => setField("title", e.target.value)} fullWidth />
+          <TextField
+            label="description"
+            value={formData.description}
+            onChange={(e) => setField("description", e.target.value)}
+            multiline
+            minRows={2}
+            fullWidth
+          />
+          <TextField
+            label="sent_from"
+            value={formData.sent_from}
+            onChange={(e) => setField("sent_from", e.target.value)}
+            helperText="발신 이메일 주소"
+            fullWidth
+          />
+          <TextField
+            label="data"
+            value={formData.data}
+            onChange={(e) => setField("data", e.target.value)}
+            helperText="이메일 본문 (HTML/MJML). 변수는 {{ name }} 형식으로 사용."
+            multiline
+            minRows={8}
+            fullWidth
+          />
+
+          {retrievedData && retrievedData.template_variables.length > 0 && (
+            <Box>
+              <Typography variant="subtitle2" sx={{ mb: 1 }}>
+                템플릿 변수
+              </Typography>
+              <Stack direction="row" spacing={1} useFlexGap flexWrap="wrap">
+                {retrievedData.template_variables.map((v) => (
+                  <Chip key={v} label={v} size="small" />
+                ))}
+              </Stack>
+            </Box>
+          )}
+
+          {id && (
+            <Box>
+              <Typography variant="subtitle1" sx={{ mb: 1 }}>
+                미리보기
+              </Typography>
+              <Stack spacing={2}>
+                <TextField
+                  label="context (JSON)"
+                  value={contextJson}
+                  onChange={(e) => setContextJson(e.target.value)}
+                  error={!jsonValid}
+                  helperText={jsonValid ? '예: {"name": "홍길동"}' : "유효한 JSON이 아닙니다."}
+                  multiline
+                  minRows={3}
+                  fullWidth
+                />
+                <Button variant="outlined" startIcon={<Visibility />} onClick={handlePreview} disabled={renderMutation.isPending || !jsonValid}>
+                  미리보기 갱신
+                </Button>
+                {renderMutation.isPending ? (
+                  <CircularProgress size={20} />
+                ) : renderMutation.error ? (
+                  <Typography color="error">미리보기를 불러오지 못했습니다.</Typography>
+                ) : renderMutation.data ? (
+                  <iframe
+                    srcDoc={renderMutation.data}
+                    style={{ width: "100%", height: 500, border: "1px solid #ccc", borderRadius: 4 }}
+                    title="이메일 템플릿 미리보기"
+                  />
+                ) : (
+                  <Typography variant="body2" color="text.secondary">
+                    미리보기 갱신 버튼을 눌러주세요.
+                  </Typography>
+                )}
+              </Stack>
+            </Box>
+          )}
+        </Stack>
+        <Stack direction="row" spacing={2} sx={{ justifyContent: "flex-end" }}>
+          <Button variant="contained" color="primary" onClick={handleSubmit} disabled={isPending} startIcon={id ? <Save /> : <Add />}>
+            {id ? "수정" : "새 객체 추가"}
+          </Button>
+        </Stack>
+      </Box>
+    );
+  })
+);
+
+export const AdminEmailTemplateEditor: React.FC = () => (
+  <BackendAdminSignInGuard>
+    <InnerAdminEmailTemplateEditor />
+  </BackendAdminSignInGuard>
+);
diff --git a/apps/pyconkr-admin/src/components/pages/notification/kakao_alimtalk_template_editor.tsx b/apps/pyconkr-admin/src/components/pages/notification/kakao_alimtalk_template_editor.tsx
new file mode 100644
index 0000000..cedb2da
--- /dev/null
+++ b/apps/pyconkr-admin/src/components/pages/notification/kakao_alimtalk_template_editor.tsx
@@ -0,0 +1,138 @@
+import { useBackendAdminClient, useRenderTemplateMutation, useRetrieveQuery } from "@frontend/common/src/hooks/useAdminAPI";
+import { Close, Visibility } from "@mui/icons-material";
+import { Box, Button, Chip, CircularProgress, IconButton, Stack, TextField, Typography } from "@mui/material";
+import { ErrorBoundary, Suspense } from "@suspensive/react";
+import * as React from "react";
+import { useNavigate, useParams } from "react-router-dom";
+
+import { BackendAdminSignInGuard } from "../../elements/admin_signin_guard";
+import { ErrorFallback } from "../../elements/error_fallback";
+
+const APP = "notification/kakao-alimtalk";
+const RESOURCE = "template";
+
+type KakaoAlimTalkTemplateSchema = {
+  id: string;
+  created_at: string;
+  created_by: string | null;
+  updated_at: string;
+  updated_by: string | null;
+  deleted_at: string | null;
+  deleted_by: string | null;
+  str_repr: string;
+  code: string;
+  title: string;
+  description: string;
+  data: string;
+  sent_from: string;
+  template_variables: string[];
+};
+
+const isValidJson = (s: string): boolean => {
+  if (!s.trim()) return true;
+  try {
+    JSON.parse(s);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+const InnerAdminKakaoAlimTalkTemplateEditor: React.FC = ErrorBoundary.with(
+  { fallback: ErrorFallback },
+  Suspense.with({ fallback: <CircularProgress /> }, () => {
+    const navigate = useNavigate();
+    const { id } = useParams<{ id?: string }>();
+    const backendAdminClient = useBackendAdminClient();
+    const { data: retrievedData } = useRetrieveQuery<KakaoAlimTalkTemplateSchema>(backendAdminClient, APP, RESOURCE, id || "");
+
+    const [contextJson, setContextJson] = React.useState("{}");
+    const renderMutation = useRenderTemplateMutation(backendAdminClient, APP, RESOURCE);
+
+    const onClose = () => navigate(`/${APP}/${RESOURCE}`);
+    const jsonValid = isValidJson(contextJson);
+
+    const handlePreview = () => {
+      if (!id || renderMutation.isPending || !jsonValid) return;
+      const context = contextJson.trim() ? JSON.parse(contextJson) : {};
+      renderMutation.mutate({ id, context });
+    };
+
+    const title = `${APP.toUpperCase()} > ${RESOURCE.toUpperCase()} > ${id ? id : ""}`;
+
+    if (!retrievedData) return null;
+
+    return (
+      <Box sx={{ flexGrow: 1, width: "100%", minHeight: "100%" }}>
+        <Stack direction="row" justifyContent="space-between">
+          <Typography variant="h5">{title}</Typography>
+          <IconButton onClick={onClose} children={<Close />} />
+        </Stack>
+        <Stack spacing={2} sx={{ my: 2 }}>
+          <TextField label="code" value={retrievedData.code} disabled fullWidth />
+          <TextField label="title" value={retrievedData.title} disabled fullWidth />
+          <TextField label="description" value={retrievedData.description} disabled multiline minRows={2} fullWidth />
+          <TextField label="sent_from" value={retrievedData.sent_from} disabled helperText="NHN Cloud Console에서 관리됩니다." fullWidth />
+          <TextField label="data" value={retrievedData.data} disabled multiline minRows={6} fullWidth />
+
+          {retrievedData.template_variables.length > 0 && (
+            <Box>
+              <Typography variant="subtitle2" sx={{ mb: 1 }}>
+                템플릿 변수
+              </Typography>
+              <Stack direction="row" spacing={1} useFlexGap flexWrap="wrap">
+                {retrievedData.template_variables.map((v) => (
+                  <Chip key={v} label={v} size="small" />
+                ))}
+              </Stack>
+            </Box>
+          )}
+
+          {id && (
+            <Box>
+              <Typography variant="subtitle1" sx={{ mb: 1 }}>
+                미리보기
+              </Typography>
+              <Stack spacing={2}>
+                <TextField
+                  label="context (JSON)"
+                  value={contextJson}
+                  onChange={(e) => setContextJson(e.target.value)}
+                  error={!jsonValid}
+                  helperText={jsonValid ? '예: {"name": "홍길동"}' : "유효한 JSON이 아닙니다."}
+                  multiline
+                  minRows={3}
+                  fullWidth
+                />
+                <Button variant="outlined" startIcon={<Visibility />} onClick={handlePreview} disabled={renderMutation.isPending || !jsonValid}>
+                  미리보기 갱신
+                </Button>
+                {renderMutation.isPending ? (
+                  <CircularProgress size={20} />
+                ) : renderMutation.error ? (
+                  <Typography color="error">미리보기를 불러오지 못했습니다.</Typography>
+                ) : renderMutation.data ? (
+                  <iframe
+                    srcDoc={renderMutation.data}
+                    style={{ width: "100%", height: 400, border: "1px solid #ccc", borderRadius: 4 }}
+                    title="카카오 알림톡 템플릿 미리보기"
+                  />
+                ) : (
+                  <Typography variant="body2" color="text.secondary">
+                    미리보기 갱신 버튼을 눌러주세요.
+                  </Typography>
+                )}
+              </Stack>
+            </Box>
+          )}
+        </Stack>
+      </Box>
+    );
+  })
+);
+
+export const AdminKakaoAlimTalkTemplateEditor: React.FC = () => (
+  <BackendAdminSignInGuard>
+    <InnerAdminKakaoAlimTalkTemplateEditor />
+  </BackendAdminSignInGuard>
+);
diff --git a/apps/pyconkr-admin/src/components/pages/notification/send_history_create.tsx b/apps/pyconkr-admin/src/components/pages/notification/send_history_create.tsx
new file mode 100644
index 0000000..251e5ce
--- /dev/null
+++ b/apps/pyconkr-admin/src/components/pages/notification/send_history_create.tsx
@@ -0,0 +1,458 @@
+import { Components } from "@frontend/common";
+import { useBackendAdminClient, useCreateMutation, useListQuery, useRenderTemplateMutation } from "@frontend/common/src/hooks/useAdminAPI";
+import { Add, Close, Delete, Send, Visibility } from "@mui/icons-material";
+import {
+  Box,
+  Button,
+  Card,
+  CardContent,
+  CircularProgress,
+  Divider,
+  FormControl,
+  FormControlLabel,
+  IconButton,
+  InputLabel,
+  MenuItem,
+  Select,
+  Stack,
+  Switch,
+  TextField,
+  Tooltip,
+  Typography,
+} from "@mui/material";
+import { ErrorBoundary, Suspense } from "@suspensive/react";
+import * as React from "react";
+import { useNavigate } from "react-router-dom";
+
+import { addErrorSnackbar, addSnackbar } from "../../../utils/snackbar";
+import { BackendAdminSignInGuard } from "../../elements/admin_signin_guard";
+import { ErrorFallback } from "../../elements/error_fallback";
+
+type NotificationChannelApp = "notification/email" | "notification/kakao-alimtalk" | "notification/sms";
+
+type AdminNotificationHistoryCreateProps = {
+  app: NotificationChannelApp;
+};
+
+type NotificationHistorySentToCreateRequest = {
+  recipient: string;
+  context: Record<string, unknown>;
+};
+
+type NotificationHistoryCreateRequest = {
+  id?: string;
+  template?: string | null;
+  template_data?: string;
+  sent_from?: string;
+  sent_to_list: NotificationHistorySentToCreateRequest[];
+};
+
+type NotificationTemplateSchema = {
+  id: string;
+  str_repr: string;
+  code: string;
+  title: string;
+  description: string;
+  data: string;
+  sent_from: string;
+  template_variables: string[];
+};
+
+type OnMemorySentTo = {
+  trackId: string;
+  recipient: string;
+  context: Record<string, string>;
+};
+
+const RESOURCE = "history";
+const TEMPLATE_RESOURCE = "template";
+
+const createEmptySentTo = (): OnMemorySentTo => ({
+  trackId: Math.random().toString(36).substring(2, 15),
+  recipient: "",
+  context: {},
+});
+
+const NotAppliableToAllRecipientsFieldList = [
+  "name",
+  "email",
+  "phone_number",
+  "organization",
+  "scancode_url",
+  "성함",
+  "성명",
+  "이메일",
+  "전화번호",
+  "소속",
+];
+
+// ---- 검증 ----------------------------------------------------------------
+const URL_REGEX = /^[a-z0-9-]+(\.[a-z0-9-]+)+([/?].*)?$/;
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+const INTERNATIONAL_PHONE_REGEX = /^\+\d{1,4}[-\s]?\d+(?:[-\s]?\d+)*$/;
+
+const isValidEmail = (value: string) => EMAIL_REGEX.test(value);
+const isValidUrl = (value: string) => URL_REGEX.test(value);
+const isValidPhone = (value: string) => URL_REGEX.test(value) || INTERNATIONAL_PHONE_REGEX.test(value);
+
+const validateRecipientForApp = (app: NotificationChannelApp, value: string): string | null => {
+  const trimmed = value.trim();
+  if (!trimmed) return null;
+  if (app === "notification/email") return isValidEmail(trimmed) ? null : "이메일 형식이 아닙니다";
+  return isValidPhone(trimmed) ? null : "휴대폰번호 형식이 아닙니다";
+};
+
+const validateTemplateVariable = (name: string, value: string): string | null => {
+  const trimmed = value.trim();
+  if (!trimmed) return null;
+  const lower = name.toLowerCase();
+  if (lower.includes("url")) return isValidUrl(trimmed) ? null : "URL 형식이 아닙니다";
+  if (lower.includes("email")) return isValidEmail(trimmed) ? null : "이메일 형식이 아닙니다";
+  if (lower.includes("phone")) return isValidPhone(trimmed) ? null : "휴대폰번호 형식이 아닙니다";
+  return null;
+};
+
+// ---- 컴포넌트 ------------------------------------------------------------
+
+type TemplateVariableFieldProps = {
+  name: string;
+  value: string;
+  onChange: (value: string) => void;
+  disabled?: boolean;
+};
+
+const TemplateVariableField: React.FC<TemplateVariableFieldProps> = ({ name, value, onChange, disabled }) => {
+  const error = validateTemplateVariable(name, value);
+  return (
+    <TextField
+      label={name}
+      value={value}
+      onChange={(e) => onChange(e.target.value)}
+      disabled={disabled}
+      error={!!error}
+      helperText={error || undefined}
+      fullWidth
+    />
+  );
+};
+
+type SentToFormProps = {
+  item: OnMemorySentTo;
+  app: NotificationChannelApp;
+  perRecipientVarNames: string[];
+  onChange: (item: OnMemorySentTo) => void;
+  onRemove: (item: OnMemorySentTo) => void;
+  onPreview?: (item: OnMemorySentTo) => void;
+};
+
+const SentToForm: React.FC<SentToFormProps> = ({ item, app, perRecipientVarNames, onChange, onRemove, onPreview }) => {
+  const setContextField = (varName: string, value: string) => onChange({ ...item, context: { ...item.context, [varName]: value } });
+  const recipientError = validateRecipientForApp(app, item.recipient);
+  return (
+    <Card variant="outlined">
+      <CardContent>
+        <Stack spacing={2}>
+          <TextField
+            label="수신자 연락처"
+            value={item.recipient}
+            onChange={(e) => onChange({ ...item, recipient: e.target.value })}
+            error={!!recipientError}
+            helperText={recipientError || undefined}
+            fullWidth
+          />
+          {perRecipientVarNames.length > 0 && (
+            <Components.Fieldset legend="템플릿 변수">
+              <Stack spacing={1}>
+                {perRecipientVarNames.map((varName) => (
+                  <TemplateVariableField
+                    key={varName}
+                    name={varName}
+                    value={item.context[varName] ?? ""}
+                    onChange={(v) => setContextField(varName, v)}
+                  />
+                ))}
+              </Stack>
+            </Components.Fieldset>
+          )}
+          <Stack direction="row" justifyContent="flex-end" spacing={1}>
+            {onPreview && (
+              <Button variant="outlined" color="info" size="small" startIcon={<Visibility />} onClick={() => onPreview(item)}>
+                이 수신자 데이터로 미리보기
+              </Button>
+            )}
+            <Button variant="outlined" color="error" size="small" startIcon={<Delete />} onClick={() => onRemove(item)}>
+              수신자 삭제
+            </Button>
+          </Stack>
+        </Stack>
+      </CardContent>
+    </Card>
+  );
+};
+
+const InnerAdminNotificationHistoryCreate: React.FC<AdminNotificationHistoryCreateProps> = ErrorBoundary.with(
+  { fallback: ErrorFallback },
+  Suspense.with({ fallback: <CircularProgress /> }, ({ app }) => {
+    const navigate = useNavigate();
+    const backendAdminClient = useBackendAdminClient();
+    const createMutation = useCreateMutation<NotificationHistoryCreateRequest>(backendAdminClient, app, RESOURCE);
+
+    const [formData, setFormData] = React.useState<{
+      template: string | null;
+      template_data: string;
+      sent_from: string;
+    }>({
+      template: null,
+      template_data: "",
+      sent_from: "",
+    });
+    const [sentToList, setSentToList] = React.useState<OnMemorySentTo[]>([]);
+    const [templateContext, setTemplateContext] = React.useState<Record<string, string>>({});
+    const [globalVarFlags, setGlobalVarFlags] = React.useState<Record<string, boolean>>({});
+
+    const templateListQuery = useListQuery<NotificationTemplateSchema>(backendAdminClient, app, TEMPLATE_RESOURCE);
+    const renderTemplateMutation = useRenderTemplateMutation(backendAdminClient, app, TEMPLATE_RESOURCE);
+    const selectedTemplate = templateListQuery.data?.find((t) => t.id === formData.template) ?? null;
+    const templateVariables = selectedTemplate?.template_variables ?? [];
+
+    const isGlobalVar = (varName: string) => globalVarFlags[varName] ?? !NotAppliableToAllRecipientsFieldList.includes(varName);
+    const perRecipientVarNames = templateVariables.filter((v) => !isGlobalVar(v));
+
+    const onClose = () => navigate(`/${app}/${RESOURCE}`);
+    const onAddSentTo = () => setSentToList((p) => [...p, createEmptySentTo()]);
+    const onChangeSentTo = (item: OnMemorySentTo) => setSentToList((p) => p.map((s) => (s.trackId === item.trackId ? item : s)));
+    const onRemoveSentTo = (item: OnMemorySentTo) => setSentToList((p) => p.filter((s) => s.trackId !== item.trackId));
+    const onTemplateChange = (templateId: string | null) => {
+      setFormData((p) => ({ ...p, template: templateId }));
+      setTemplateContext({});
+      setGlobalVarFlags({});
+      if (templateId) {
+        renderTemplateMutation.mutate({ id: templateId, context: {} });
+      } else {
+        renderTemplateMutation.reset();
+      }
+    };
+    const onRefreshPreview = () => {
+      if (!formData.template) return;
+      renderTemplateMutation.mutate({ id: formData.template, context: templateContext });
+    };
+    const onPreviewWithRecipient = (item: OnMemorySentTo) => {
+      if (!formData.template) return;
+      const globalContext: Record<string, string> = {};
+      templateVariables.forEach((varName) => {
+        if (isGlobalVar(varName)) globalContext[varName] = templateContext[varName] ?? "";
+      });
+      renderTemplateMutation.mutate({ id: formData.template, context: { ...globalContext, ...item.context } });
+    };
+    const onToggleGlobalVar = (varName: string, checked: boolean) => setGlobalVarFlags((p) => ({ ...p, [varName]: checked }));
+
+    const sentFromError = !selectedTemplate ? validateRecipientForApp(app, formData.sent_from) : null;
+
+    // 발송 버튼 비활성화 사유: 우선순위에 따라 첫 번째로 매칭되는 메시지 반환. 모두 통과하면 null.
+    // 우선순위: 템플릿 선택 → 수신자 연락처 (누락/형식) → sent_from 형식 → 템플릿 변수 (누락/형식).
+    const submitBlockMessage = ((): string | null => {
+      if (!formData.template) return "템플릿을 선택해주세요";
+      if (sentToList.length === 0 || sentToList.some((s) => !s.recipient.trim())) return "수신자 연락처 입력이 누락되었습니다";
+      if (sentToList.some((s) => validateRecipientForApp(app, s.recipient))) return "수신자 연락처 형식이 올바르지 않습니다";
+      if (sentFromError) return "sent_from 형식이 올바르지 않습니다";
+      for (const varName of templateVariables) {
+        if (isGlobalVar(varName)) {
+          const value = templateContext[varName] ?? "";
+          if (!value.trim()) return "누락된 템플릿 변수 입력이 있습니다";
+          if (validateTemplateVariable(varName, value)) return "템플릿 변수 입력 형식이 올바르지 않습니다";
+        } else {
+          for (const s of sentToList) {
+            const value = s.context[varName] ?? "";
+            if (!value.trim()) return "누락된 템플릿 변수 입력이 있습니다";
+            if (validateTemplateVariable(varName, value)) return "템플릿 변수 입력 형식이 올바르지 않습니다";
+          }
+        }
+      }
+      return null;
+    })();
+
+    const buildPayload = (): NotificationHistoryCreateRequest => {
+      const globalContext: Record<string, string> = {};
+      templateVariables.forEach((varName) => {
+        if (isGlobalVar(varName)) globalContext[varName] = templateContext[varName] ?? "";
+      });
+      return {
+        template: formData.template,
+        template_data: formData.template_data,
+        sent_from: selectedTemplate ? selectedTemplate.sent_from : formData.sent_from,
+        sent_to_list: sentToList.map((s) => ({
+          recipient: s.recipient,
+          context: { ...globalContext, ...s.context },
+        })),
+      };
+    };
+
+    const handleSubmit = () => {
+      if (createMutation.isPending) return;
+      if (sentToList.length === 0) {
+        addSnackbar("수신자를 한 명 이상 추가해주세요.", "error");
+        return;
+      }
+
+      createMutation.mutate(buildPayload(), {
+        onSuccess: (data) => {
+          addSnackbar("발송 요청을 완료했습니다.", "success");
+          const newId = (data as NotificationHistoryCreateRequest).id;
+          if (newId) navigate(`/${app}/${RESOURCE}/${newId}`);
+        },
+        onError: addErrorSnackbar,
+      });
+    };
+
+    const title = `${app.toUpperCase()} > ${RESOURCE.toUpperCase()} > 새로 발송`;
+
+    return (
+      <Box sx={{ flexGrow: 1, width: "100%", minHeight: "100%" }}>
+        <Stack direction="row" justifyContent="space-between">
+          <Typography variant="h5">{title}</Typography>
+          <IconButton onClick={onClose} children={<Close />} />
+        </Stack>
+        <Stack spacing={2} sx={{ my: 2 }}>
+          <Stack direction="row" spacing={2}>
+            <Stack spacing={2} sx={{ flex: 1, minWidth: 0 }}>
+              <FormControl fullWidth>
+                <InputLabel id="template-select-label">template</InputLabel>
+                <Select
+                  labelId="template-select-label"
+                  label="template"
+                  value={formData.template ?? ""}
+                  onChange={(e) => onTemplateChange((e.target.value as string) || null)}
+                >
+                  <MenuItem value="">
+                    <em>(없음)</em>
+                  </MenuItem>
+                  {(templateListQuery.data ?? []).map((t) => (
+                    <MenuItem key={t.id} value={t.id}>
+                      {t.str_repr}
+                    </MenuItem>
+                  ))}
+                </Select>
+              </FormControl>
+              <Stack spacing={1}>
+                {!formData.template ? (
+                  <Typography variant="body2" color="text.secondary">
+                    템플릿을 선택해주세요.
+                  </Typography>
+                ) : templateVariables.length === 0 ? (
+                  <Typography variant="body2" color="text.secondary">
+                    이 템플릿은 변수가 없습니다.
+                  </Typography>
+                ) : (
+                  <>
+                    <TextField
+                      label="sent_from"
+                      value={selectedTemplate ? selectedTemplate.sent_from : formData.sent_from}
+                      onChange={(e) => setFormData((p) => ({ ...p, sent_from: e.target.value }))}
+                      disabled={!!selectedTemplate}
+                      error={!!sentFromError}
+                      helperText={selectedTemplate ? "선택된 템플릿의 sent_from 값을 사용합니다." : sentFromError || undefined}
+                      fullWidth
+                    />
+                    <Components.Fieldset legend="템플릿 변수">
+                      {templateVariables.map((varName) => {
+                        const isAllRecipientsForbidden = NotAppliableToAllRecipientsFieldList.includes(varName);
+                        const globalChecked = isGlobalVar(varName);
+                        return (
+                          <React.Fragment key={varName}>
+                            <TemplateVariableField
+                              name={varName}
+                              value={templateContext[varName] ?? ""}
+                              onChange={(v) => setTemplateContext((p) => ({ ...p, [varName]: v }))}
+                              disabled={!globalChecked}
+                            />
+                            <FormControlLabel
+                              control={
+                                <Switch
+                                  checked={globalChecked}
+                                  onChange={(_, checked) => onToggleGlobalVar(varName, checked)}
+                                  disabled={isAllRecipientsForbidden}
+                                />
+                              }
+                              label="모든 수신자에게 적용"
+                            />
+                          </React.Fragment>
+                        );
+                      })}
+                    </Components.Fieldset>
+                  </>
+                )}
+              </Stack>
+            </Stack>
+            <Stack spacing={1} sx={{ flex: 1, minWidth: 0 }}>
+              {!formData.template ? (
+                <Typography variant="body2" color="text.secondary">
+                  템플릿을 선택해주세요.
+                </Typography>
+              ) : renderTemplateMutation.isPending ? (
+                <CircularProgress size={20} />
+              ) : renderTemplateMutation.error ? (
+                <Typography color="error">미리보기를 불러오지 못했습니다.</Typography>
+              ) : renderTemplateMutation.data ? (
+                <iframe
+                  srcDoc={renderTemplateMutation.data}
+                  style={{ width: "100%", minHeight: 500, maxHeight: "100%", height: "100%", border: "1px solid #ccc", borderRadius: 4 }}
+                  title="템플릿 미리보기"
+                />
+              ) : (
+                <Typography variant="body2" color="text.secondary">
+                  미리보기를 준비하는 중입니다.
+                </Typography>
+              )}
+              <Button variant="outlined" onClick={onRefreshPreview} disabled={!formData.template || renderTemplateMutation.isPending}>
+                미리보기 갱신
+              </Button>
+            </Stack>
+          </Stack>
+          <Divider />
+          <Box>
+            <Typography variant="subtitle1" sx={{ mb: 1 }}>
+              수신자 목록 ({sentToList.length}건)
+            </Typography>
+            <Stack spacing={2}>
+              <Button variant="outlined" startIcon={<Add />} onClick={onAddSentTo}>
+                수신자 추가
+              </Button>
+              {sentToList.map((item) => (
+                <SentToForm
+                  key={item.trackId}
+                  item={item}
+                  app={app}
+                  perRecipientVarNames={perRecipientVarNames}
+                  onChange={onChangeSentTo}
+                  onRemove={onRemoveSentTo}
+                  onPreview={formData.template ? onPreviewWithRecipient : undefined}
+                />
+              ))}
+            </Stack>
+          </Box>
+        </Stack>
+        <Stack direction="row" spacing={2} sx={{ justifyContent: "flex-end" }}>
+          <Tooltip title={submitBlockMessage ?? ""}>
+            <span>
+              <Button
+                variant="contained"
+                color="primary"
+                onClick={handleSubmit}
+                disabled={!!submitBlockMessage || createMutation.isPending}
+                startIcon={<Send />}
+              >
+                발송
+              </Button>
+            </span>
+          </Tooltip>
+        </Stack>
+      </Box>
+    );
+  })
+);
+
+export const AdminNotificationHistoryCreate: React.FC<AdminNotificationHistoryCreateProps> = (props) => (
+  <BackendAdminSignInGuard>
+    <InnerAdminNotificationHistoryCreate {...props} />
+  </BackendAdminSignInGuard>
+);
diff --git a/apps/pyconkr-admin/src/components/pages/notification/send_history_result.tsx b/apps/pyconkr-admin/src/components/pages/notification/send_history_result.tsx
new file mode 100644
index 0000000..a73018b
--- /dev/null
+++ b/apps/pyconkr-admin/src/components/pages/notification/send_history_result.tsx
@@ -0,0 +1,359 @@
+import {
+  useBackendAdminClient,
+  useRenderSentToQuery,
+  useRetrieveQuery,
+  useRetryHistoryMutation,
+  useRetrySentToMutation,
+} from "@frontend/common/src/hooks/useAdminAPI";
+import { Add, Close, ExpandLess, ExpandMore, Replay } from "@mui/icons-material";
+import {
+  alpha,
+  Box,
+  Button,
+  Chip,
+  CircularProgress,
+  Collapse,
+  FormControlLabel,
+  IconButton,
+  List,
+  ListItemButton,
+  ListItemText,
+  Stack,
+  Switch,
+  Tab,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  Tabs,
+  Typography,
+} from "@mui/material";
+import { ErrorBoundary, Suspense } from "@suspensive/react";
+import * as React from "react";
+import { Link, useNavigate, useParams } from "react-router-dom";
+
+import { addErrorSnackbar, addSnackbar } from "../../../utils/snackbar";
+import { BackendAdminSignInGuard } from "../../elements/admin_signin_guard";
+import { ErrorFallback } from "../../elements/error_fallback";
+
+type NotificationChannelApp = "notification/email" | "notification/kakao-alimtalk" | "notification/sms";
+
+type AdminNotificationHistoryEditorProps = {
+  app: NotificationChannelApp;
+};
+
+type NotificationStatus = "CREATED" | "SENDING" | "SENT" | "FAILED";
+
+type NotificationHistorySentToStatusSummary = {
+  created: number;
+  sending: number;
+  sent: number;
+  failed: number;
+};
+
+type NotificationHistorySentToSchema = {
+  id: string;
+  created_at: string;
+  created_by: string | null;
+  updated_at: string;
+  updated_by: string | null;
+  deleted_at: string | null;
+  deleted_by: string | null;
+  str_repr: string;
+  recipient: string;
+  context: Record<string, unknown>;
+  status: NotificationStatus;
+  failure_reason: string | null;
+};
+
+type NotificationHistorySchema = {
+  id: string;
+  created_at: string;
+  created_by: string | null;
+  updated_at: string;
+  updated_by: string | null;
+  deleted_at: string | null;
+  deleted_by: string | null;
+  str_repr: string;
+  template: string | null;
+  template_code: string;
+  template_data: string;
+  sent_from: string;
+  sent_to_list: NotificationHistorySentToSchema[];
+  sent_to_status_summary: NotificationHistorySentToStatusSummary;
+};
+
+const RESOURCE = "history";
+
+const STATUS_COLOR: Record<NotificationStatus, "info" | "warning" | "success" | "error"> = {
+  CREATED: "info",
+  SENDING: "warning",
+  SENT: "success",
+  FAILED: "error",
+};
+const ReadOnlyFieldNames: (keyof NotificationHistorySchema)[] = ["id", "created_at", "created_by", "sent_from"];
+
+type SentToListItemProps = {
+  item: NotificationHistorySentToSchema;
+  app: NotificationChannelApp;
+  historyId: string;
+  selected: boolean;
+  onSelect: (sentToId: string) => void;
+};
+
+const SentToListItem: React.FC<SentToListItemProps> = ({ item, app, historyId, selected, onSelect }) => {
+  const [open, setOpen] = React.useState(false);
+  const backendAdminClient = useBackendAdminClient();
+  const retryMutation = useRetrySentToMutation(backendAdminClient, app, RESOURCE, historyId, item.id);
+
+  const handleClick = () => {
+    setOpen((o) => !o);
+    onSelect(item.id);
+  };
+
+  const handleRetry = (e: React.MouseEvent) => {
+    e.stopPropagation();
+    if (retryMutation.isPending) return;
+    if (!window.confirm("재시도하시겠습니까?")) return;
+    retryMutation.mutate(undefined, {
+      onSuccess: () => addSnackbar("재시도 요청을 완료했습니다.", "success"),
+      onError: addErrorSnackbar,
+    });
+  };
+
+  return (
+    <>
+      <ListItemButton
+        onClick={handleClick}
+        selected={selected}
+        sx={(theme) => ({
+          backgroundColor: alpha(theme.palette[STATUS_COLOR[item.status]].main, 0.1),
+          "&:hover": { backgroundColor: alpha(theme.palette[STATUS_COLOR[item.status]].main, 0.2) },
+          "&.Mui-selected": { backgroundColor: alpha(theme.palette[STATUS_COLOR[item.status]].main, 0.25) },
+          "&.Mui-selected:hover": { backgroundColor: alpha(theme.palette[STATUS_COLOR[item.status]].main, 0.3) },
+        })}
+      >
+        <ListItemText>{String(item.recipient)}</ListItemText>
+        <Chip label={item.status} color={STATUS_COLOR[item.status]} size="small" sx={{ mr: 1 }} />
+        {item.status === "FAILED" && (
+          <IconButton size="small" color="error" onClick={handleRetry} disabled={retryMutation.isPending} title="재시도" sx={{ mr: 1 }}>
+            <Replay fontSize="small" />
+          </IconButton>
+        )}
+        {open ? <ExpandLess /> : <ExpandMore />}
+      </ListItemButton>
+      <Collapse in={open} timeout="auto" unmountOnExit>
+        {Object.keys(item.context).length >= 1 ? (
+          <List>
+            {Object.entries(item.context).map(([key, value]) => (
+              <ListItemButton key={key} sx={{ pl: 4 }}>
+                <ListItemText>{key}</ListItemText>
+                <ListItemText>{String(value)}</ListItemText>
+              </ListItemButton>
+            ))}
+          </List>
+        ) : (
+          <Typography sx={{ pl: 4, fontStyle: "italic" }}>컨텍스트 데이터가 없습니다.</Typography>
+        )}
+      </Collapse>
+    </>
+  );
+};
+
+const InnerAdminNotificationHistoryEditor: React.FC<AdminNotificationHistoryEditorProps> = ErrorBoundary.with(
+  { fallback: ErrorFallback },
+  Suspense.with({ fallback: <CircularProgress /> }, ({ app }) => {
+    const navigate = useNavigate();
+    const { id } = useParams<{ id?: string }>();
+
+    const backendAdminClient = useBackendAdminClient();
+    const { data: retrievedData } = useRetrieveQuery<NotificationHistorySchema>(backendAdminClient, app, RESOURCE, id || "");
+    const [statusFilter, setStatusFilter] = React.useState<Record<NotificationStatus, boolean>>({
+      CREATED: true,
+      SENDING: true,
+      SENT: true,
+      FAILED: true,
+    });
+    const [selectedSentToId, setSelectedSentToId] = React.useState<string | null>(null);
+    const [renderTab, setRenderTab] = React.useState<0 | 1>(0);
+    const renderQuery = useRenderSentToQuery(backendAdminClient, app, RESOURCE, id ?? "", selectedSentToId);
+    const retryHistoryMutation = useRetryHistoryMutation(backendAdminClient, app, RESOURCE, id ?? "");
+
+    if (!retrievedData) return null;
+
+    const selectedItem = retrievedData.sent_to_list.find((s) => s.id === selectedSentToId) ?? null;
+    const onClose = () => navigate(`/${app}/${RESOURCE}`);
+    const goToCreateNew = () => navigate(`/${app}/${RESOURCE}/create`);
+    const failedCount = retrievedData.sent_to_status_summary.failed;
+    const handleRetryAllFailed = () => {
+      if (retryHistoryMutation.isPending || failedCount === 0) return;
+      if (!window.confirm(`실패한 ${failedCount}건을 재시도하시겠습니까?`)) return;
+      retryHistoryMutation.mutate(undefined, {
+        onSuccess: () => addSnackbar(`${failedCount}건의 재시도 요청을 완료했습니다.`, "success"),
+        onError: addErrorSnackbar,
+      });
+    };
+
+    return (
+      <Box sx={{ flexGrow: 1, width: "100%", minHeight: "100%" }}>
+        <Stack direction="row" justifyContent="space-between">
+          <Typography variant="h5">{`${app.toUpperCase()} > ${RESOURCE.toUpperCase()} > 발송 이력`}</Typography>
+          <IconButton onClick={onClose} children={<Close />} />
+        </Stack>
+        {id && (
+          <>
+            <Table>
+              <TableHead>
+                <TableRow>
+                  <TableCell>필드</TableCell>
+                  <TableCell>값</TableCell>
+                </TableRow>
+              </TableHead>
+              <TableBody>
+                {ReadOnlyFieldNames.map((key) => (
+                  <TableRow key={key}>
+                    <TableCell>{key}</TableCell>
+                    <TableCell>{retrievedData[key] == null ? "" : String(retrievedData[key])}</TableCell>
+                  </TableRow>
+                ))}
+                <TableRow>
+                  <TableCell>template</TableCell>
+                  <TableCell>
+                    <Link to={`/${app}/template/${retrievedData.template}`}>{retrievedData.template_code}</Link>
+                  </TableCell>
+                </TableRow>
+              </TableBody>
+            </Table>
+            <br />
+            <Stack direction="row" spacing={2}>
+              <FormControlLabel
+                control={
+                  <Switch
+                    color={STATUS_COLOR.CREATED}
+                    checked={statusFilter.CREATED}
+                    onChange={(_, checked) => setStatusFilter((p) => ({ ...p, CREATED: checked }))}
+                    disabled={retrievedData.sent_to_status_summary.created === 0}
+                  />
+                }
+                label={`대기 : ${retrievedData.sent_to_status_summary.created}`}
+              />
+              <FormControlLabel
+                control={
+                  <Switch
+                    color={STATUS_COLOR.SENDING}
+                    checked={statusFilter.SENDING}
+                    onChange={(_, checked) => setStatusFilter((p) => ({ ...p, SENDING: checked }))}
+                    disabled={retrievedData.sent_to_status_summary.sending === 0}
+                  />
+                }
+                label={`진행 : ${retrievedData.sent_to_status_summary.sending}`}
+              />
+              <FormControlLabel
+                control={
+                  <Switch
+                    color={STATUS_COLOR.SENT}
+                    checked={statusFilter.SENT}
+                    onChange={(_, checked) => setStatusFilter((p) => ({ ...p, SENT: checked }))}
+                    disabled={retrievedData.sent_to_status_summary.sent === 0}
+                  />
+                }
+                label={`성공 : ${retrievedData.sent_to_status_summary.sent}`}
+              />
+              <FormControlLabel
+                control={
+                  <Switch
+                    color={STATUS_COLOR.FAILED}
+                    checked={statusFilter.FAILED}
+                    onChange={(_, checked) => setStatusFilter((p) => ({ ...p, FAILED: checked }))}
+                    disabled={failedCount === 0}
+                  />
+                }
+                label={`실패 : ${failedCount}`}
+              />
+              <Button
+                variant="outlined"
+                color={STATUS_COLOR.FAILED}
+                size="small"
+                startIcon={<Replay />}
+                onClick={handleRetryAllFailed}
+                disabled={failedCount === 0 || retryHistoryMutation.isPending}
+                style={{ marginLeft: "auto" }}
+              >
+                실패 항목 재시도
+              </Button>
+            </Stack>
+          </>
+        )}
+        <br />
+        <Stack direction="row" spacing={2} sx={{ width: "100%" }}>
+          <Stack sx={{ width: "100%" }}>
+            <List disablePadding>
+              {retrievedData.sent_to_list
+                .filter((item) => statusFilter[item.status])
+                .map((item) => (
+                  <SentToListItem
+                    key={item.id}
+                    item={item}
+                    app={app}
+                    historyId={retrievedData.id}
+                    selected={selectedSentToId === item.id}
+                    onSelect={setSelectedSentToId}
+                  />
+                ))}
+            </List>
+          </Stack>
+          <Stack sx={{ width: "100%" }}>
+            {selectedItem ? (
+              <>
+                {selectedItem.status === "FAILED" && (
+                  <Tabs value={renderTab} onChange={(_, v) => setRenderTab(v as 0 | 1)} sx={{ mb: 1 }}>
+                    <Tab label="실패 사유" />
+                    <Tab label="렌더링 결과" />
+                  </Tabs>
+                )}
+                {selectedItem.status === "FAILED" && renderTab === 0 ? (
+                  <Box
+                    component="pre"
+                    sx={{
+                      p: 2,
+                      m: 0,
+                      backgroundColor: "grey.100",
+                      borderRadius: 1,
+                      overflow: "auto",
+                      whiteSpace: "pre-wrap",
+                      fontFamily: "monospace",
+                      fontSize: "0.875rem",
+                    }}
+                  >
+                    <code>{selectedItem.failure_reason || "(실패 사유 없음)"}</code>
+                  </Box>
+                ) : renderQuery.isLoading ? (
+                  <CircularProgress />
+                ) : renderQuery.error ? (
+                  <Typography color="error">렌더링 결과를 불러오지 못했습니다.</Typography>
+                ) : (
+                  <iframe srcDoc={renderQuery.data ?? ""} style={{ width: "100%", minHeight: 500, border: "1px solid #ccc", borderRadius: 4 }} />
+                )}
+              </>
+            ) : (
+              "옆의 수신자 목록을 클릭하면, 수신자에게 보내진 알림의 모습을 볼 수 있습니다."
+            )}
+          </Stack>
+        </Stack>
+        <br />
+        <Stack direction="row" spacing={2} sx={{ justifyContent: "flex-end" }}>
+          <Button variant="outlined" color="info" onClick={goToCreateNew} startIcon={<Add />}>
+            새로 보내기
+          </Button>
+        </Stack>
+      </Box>
+    );
+  })
+);
+
+export const AdminNotificationHistoryEditor: React.FC<AdminNotificationHistoryEditorProps> = (props) => (
+  <BackendAdminSignInGuard>
+    <InnerAdminNotificationHistoryEditor {...props} />
+  </BackendAdminSignInGuard>
+);
diff --git a/apps/pyconkr-admin/src/components/pages/notification/sms_template_editor.tsx b/apps/pyconkr-admin/src/components/pages/notification/sms_template_editor.tsx
new file mode 100644
index 0000000..05571b1
--- /dev/null
+++ b/apps/pyconkr-admin/src/components/pages/notification/sms_template_editor.tsx
@@ -0,0 +1,205 @@
+import {
+  useBackendAdminClient,
+  useCreateMutation,
+  useRenderTemplateMutation,
+  useRetrieveQuery,
+  useUpdateMutation,
+} from "@frontend/common/src/hooks/useAdminAPI";
+import { Add, Close, Save, Visibility } from "@mui/icons-material";
+import { Box, Button, Chip, CircularProgress, IconButton, Stack, TextField, Typography } from "@mui/material";
+import { ErrorBoundary, Suspense } from "@suspensive/react";
+import * as React from "react";
+import { useNavigate, useParams } from "react-router-dom";
+
+import { addErrorSnackbar, addSnackbar } from "../../../utils/snackbar";
+import { BackendAdminSignInGuard } from "../../elements/admin_signin_guard";
+import { ErrorFallback } from "../../elements/error_fallback";
+
+const APP = "notification/sms";
+const RESOURCE = "template";
+
+type SMSTemplateFormData = {
+  code: string;
+  title: string;
+  description: string;
+  data: string;
+  sent_from: string;
+};
+
+type SMSTemplateSchema = SMSTemplateFormData & {
+  id: string;
+  created_at: string;
+  created_by: string | null;
+  updated_at: string;
+  updated_by: string | null;
+  deleted_at: string | null;
+  deleted_by: string | null;
+  str_repr: string;
+  template_variables: string[];
+};
+
+const isValidJson = (s: string): boolean => {
+  if (!s.trim()) return true;
+  try {
+    JSON.parse(s);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+const InnerAdminSMSTemplateEditor: React.FC = ErrorBoundary.with(
+  { fallback: ErrorFallback },
+  Suspense.with({ fallback: <CircularProgress /> }, () => {
+    const navigate = useNavigate();
+    const { id } = useParams<{ id?: string }>();
+    const backendAdminClient = useBackendAdminClient();
+    const { data: retrievedData } = useRetrieveQuery<SMSTemplateSchema>(backendAdminClient, APP, RESOURCE, id || "");
+
+    const [formData, setFormData] = React.useState<SMSTemplateFormData>(() => ({
+      code: retrievedData?.code ?? "",
+      title: retrievedData?.title ?? "",
+      description: retrievedData?.description ?? "",
+      data: retrievedData?.data ?? "",
+      sent_from: retrievedData?.sent_from ?? "",
+    }));
+    const [contextJson, setContextJson] = React.useState("{}");
+
+    const createMutation = useCreateMutation<SMSTemplateFormData>(backendAdminClient, APP, RESOURCE);
+    const updateMutation = useUpdateMutation<SMSTemplateFormData>(backendAdminClient, APP, RESOURCE, id || "");
+    const renderMutation = useRenderTemplateMutation(backendAdminClient, APP, RESOURCE);
+
+    const setField = <K extends keyof SMSTemplateFormData>(key: K, value: SMSTemplateFormData[K]) => setFormData((p) => ({ ...p, [key]: value }));
+    const onClose = () => navigate(`/${APP}/${RESOURCE}`);
+
+    const isPending = createMutation.isPending || updateMutation.isPending;
+    const jsonValid = isValidJson(contextJson);
+
+    const handleSubmit = () => {
+      if (isPending) return;
+      if (id) {
+        updateMutation.mutate(formData, {
+          onSuccess: () => addSnackbar("수정했습니다.", "success"),
+          onError: addErrorSnackbar,
+        });
+      } else {
+        createMutation.mutate(formData, {
+          onSuccess: (data) => {
+            addSnackbar("생성했습니다.", "success");
+            const newId = (data as SMSTemplateFormData & { id?: string }).id;
+            if (newId) navigate(`/${APP}/${RESOURCE}/${newId}`);
+          },
+          onError: addErrorSnackbar,
+        });
+      }
+    };
+
+    const handlePreview = () => {
+      if (!id || renderMutation.isPending || !jsonValid) return;
+      const context = contextJson.trim() ? JSON.parse(contextJson) : {};
+      renderMutation.mutate({ id, context });
+    };
+
+    const title = `${APP.toUpperCase()} > ${RESOURCE.toUpperCase()} > ${id ? "편집: " + id : "새 객체 추가"}`;
+
+    return (
+      <Box sx={{ flexGrow: 1, width: "100%", minHeight: "100%" }}>
+        <Stack direction="row" justifyContent="space-between">
+          <Typography variant="h5">{title}</Typography>
+          <IconButton onClick={onClose} children={<Close />} />
+        </Stack>
+        <Stack spacing={2} sx={{ my: 2 }}>
+          <TextField label="code" value={formData.code} onChange={(e) => setField("code", e.target.value)} fullWidth />
+          <TextField label="title" value={formData.title} onChange={(e) => setField("title", e.target.value)} fullWidth />
+          <TextField
+            label="description"
+            value={formData.description}
+            onChange={(e) => setField("description", e.target.value)}
+            multiline
+            minRows={2}
+            fullWidth
+          />
+          <TextField
+            label="sent_from"
+            value={formData.sent_from}
+            onChange={(e) => setField("sent_from", e.target.value)}
+            helperText="발신 휴대폰번호 (최대 13자)"
+            inputProps={{ maxLength: 13 }}
+            fullWidth
+          />
+          <TextField
+            label="data"
+            value={formData.data}
+            onChange={(e) => setField("data", e.target.value)}
+            helperText={`SMS 본문. 변수는 {{ name }} 형식으로 사용. 현재 ${formData.data.length}자.`}
+            multiline
+            minRows={4}
+            fullWidth
+          />
+
+          {retrievedData && retrievedData.template_variables.length > 0 && (
+            <Box>
+              <Typography variant="subtitle2" sx={{ mb: 1 }}>
+                템플릿 변수
+              </Typography>
+              <Stack direction="row" spacing={1} useFlexGap flexWrap="wrap">
+                {retrievedData.template_variables.map((v) => (
+                  <Chip key={v} label={v} size="small" />
+                ))}
+              </Stack>
+            </Box>
+          )}
+
+          {id && (
+            <Box>
+              <Typography variant="subtitle1" sx={{ mb: 1 }}>
+                미리보기
+              </Typography>
+              <Stack spacing={2}>
+                <TextField
+                  label="context (JSON)"
+                  value={contextJson}
+                  onChange={(e) => setContextJson(e.target.value)}
+                  error={!jsonValid}
+                  helperText={jsonValid ? '예: {"name": "홍길동"}' : "유효한 JSON이 아닙니다."}
+                  multiline
+                  minRows={3}
+                  fullWidth
+                />
+                <Button variant="outlined" startIcon={<Visibility />} onClick={handlePreview} disabled={renderMutation.isPending || !jsonValid}>
+                  미리보기 갱신
+                </Button>
+                {renderMutation.isPending ? (
+                  <CircularProgress size={20} />
+                ) : renderMutation.error ? (
+                  <Typography color="error">미리보기를 불러오지 못했습니다.</Typography>
+                ) : renderMutation.data ? (
+                  <iframe
+                    srcDoc={renderMutation.data}
+                    style={{ width: "100%", height: 300, border: "1px solid #ccc", borderRadius: 4 }}
+                    title="SMS 템플릿 미리보기"
+                  />
+                ) : (
+                  <Typography variant="body2" color="text.secondary">
+                    미리보기 갱신 버튼을 눌러주세요.
+                  </Typography>
+                )}
+              </Stack>
+            </Box>
+          )}
+        </Stack>
+        <Stack direction="row" spacing={2} sx={{ justifyContent: "flex-end" }}>
+          <Button variant="contained" color="primary" onClick={handleSubmit} disabled={isPending} startIcon={id ? <Save /> : <Add />}>
+            {id ? "수정" : "새 객체 추가"}
+          </Button>
+        </Stack>
+      </Box>
+    );
+  })
+);
+
+export const AdminSMSTemplateEditor: React.FC = () => (
+  <BackendAdminSignInGuard>
+    <InnerAdminSMSTemplateEditor />
+  </BackendAdminSignInGuard>
+);
diff --git a/apps/pyconkr-admin/src/main.tsx b/apps/pyconkr-admin/src/main.tsx
index 1bb8f80..878ce27 100644
--- a/apps/pyconkr-admin/src/main.tsx
+++ b/apps/pyconkr-admin/src/main.tsx
@@ -3,7 +3,7 @@ import type { ContextOptions } from "@frontend/common/src/contexts";
 import * as Shop from "@frontend/shop";
 import { CircularProgress } from "@mui/material";
 import { ErrorBoundary, Suspense } from "@suspensive/react";
-import { MutationCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { matchQuery, MutationCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 import { SnackbarProvider } from "notistack";
 import * as React from "react";
@@ -24,9 +24,13 @@ const queryClient = new QueryClient({
     },
   },
   mutationCache: new MutationCache({
-    onSuccess: () => {
-      queryClient.invalidateQueries({ predicate: () => true });
-      queryClient.resetQueries({ predicate: () => true });
+    onSuccess: (_data, _variables, _context, mutation) => {
+      queryClient.invalidateQueries({
+        predicate: (query) => mutation.meta?.invalidates?.some((queryKey) => matchQuery({ queryKey }, query)) ?? true,
+      });
+      queryClient.resetQueries({
+        predicate: (query) => mutation.meta?.invalidates?.some((queryKey) => matchQuery({ queryKey }, query)) ?? true,
+      });
     },
   }),
 });
diff --git a/apps/pyconkr-admin/src/routes.tsx b/apps/pyconkr-admin/src/routes.tsx
index bc96b46..7c35486 100644
--- a/apps/pyconkr-admin/src/routes.tsx
+++ b/apps/pyconkr-admin/src/routes.tsx
@@ -5,15 +5,22 @@ import {
   Article,
   AutoFixHigh,
   Category,
+  ChatBubble,
   ClearAll,
+  Email,
   Event,
   FilePresent,
+  Forum,
   Handshake,
   ManageAccounts,
+  MarkEmailRead,
   MeetingRoom,
   NoteAlt,
+  Send,
+  Sms,
   StickyNote2,
   Tag,
+  VpnKey,
 } from "@mui/icons-material";
 
 import { AdminEditorCreateRoutePage, AdminEditorModifyRoutePage } from "./components/layouts/admin_editor";
@@ -22,9 +29,15 @@ import { RouteDef } from "./components/layouts/global";
 import { AccountRedirectPage } from "./components/pages/account/account";
 import { AccountManagementPage } from "./components/pages/account/manage";
 import { SignInPage } from "./components/pages/account/sign_in";
+import { AdminGoogleOAuth2Editor } from "./components/pages/external_api/google_oauth2_editor";
 import { PublicFileUploadPage } from "./components/pages/file/upload";
 import { AdminModificationAuditList } from "./components/pages/modification_audit/list";
 import { AdminModificationAuditEditor } from "./components/pages/modification_audit/pages";
+import { AdminNotificationHistoryCreate } from "./components/pages/notification/send_history_create";
+import { AdminNotificationHistoryEditor } from "./components/pages/notification/send_history_result";
+import { AdminEmailTemplateEditor } from "./components/pages/notification/email_template_editor";
+import { AdminKakaoAlimTalkTemplateEditor } from "./components/pages/notification/kakao_alimtalk_template_editor";
+import { AdminSMSTemplateEditor } from "./components/pages/notification/sms_template_editor";
 import { AdminCMSPageEditor } from "./components/pages/page/editor";
 import { AdminPresentationEditor } from "./components/pages/presentation/editor";
 import { SiteMapList } from "./components/pages/sitemap/list";
@@ -177,6 +190,77 @@ export const RouteDefinitions: RouteDef[] = [
     app: "user",
     resource: "organization",
   },
+  {
+    type: "separator",
+    key: "notification-template-separator",
+    title: "알림 템플릿",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "notification-email-template",
+    icon: Email,
+    title: "이메일 템플릿",
+    app: "notification/email",
+    resource: "template",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "notification-kakao-alimtalk-template",
+    icon: Forum,
+    title: "카카오 알림톡 템플릿",
+    app: "notification/kakao-alimtalk",
+    resource: "template",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "notification-sms-template",
+    icon: Sms,
+    title: "SMS 템플릿",
+    app: "notification/sms",
+    resource: "template",
+  },
+  {
+    type: "separator",
+    key: "notification-history-separator",
+    title: "알림 발송 이력",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "notification-email-history",
+    icon: MarkEmailRead,
+    title: "이메일 발송 이력",
+    app: "notification/email",
+    resource: "history",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "notification-kakao-alimtalk-history",
+    icon: ChatBubble,
+    title: "카카오 알림톡 발송 이력",
+    app: "notification/kakao-alimtalk",
+    resource: "history",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "notification-sms-history",
+    icon: Send,
+    title: "SMS 발송 이력",
+    app: "notification/sms",
+    resource: "history",
+  },
+  {
+    type: "separator",
+    key: "external-api-separator",
+    title: "외부 API",
+  },
+  {
+    type: "autoAdminRouteDefinition",
+    key: "external-api-google-oauth2",
+    icon: VpnKey,
+    title: "Google OAuth2",
+    app: "external-api/google",
+    resource: "oauth2",
+  },
   {
     type: "routeDefinition",
     key: "user-account",
@@ -207,6 +291,20 @@ export const RegisteredRoutes = {
   ),
   "/cms/page/create": <AdminCMSPageEditor />,
   "/cms/page/:id": <AdminCMSPageEditor />,
+  "/notification/email/template/create": <AdminEmailTemplateEditor />,
+  "/notification/email/template/:id": <AdminEmailTemplateEditor />,
+  "/notification/email/history/create": <AdminNotificationHistoryCreate app="notification/email" />,
+  "/notification/email/history/:id": <AdminNotificationHistoryEditor app="notification/email" />,
+  "/notification/kakao-alimtalk/template": <AdminList app="notification/kakao-alimtalk" resource="template" hideCreateNew />,
+  "/notification/kakao-alimtalk/template/:id": <AdminKakaoAlimTalkTemplateEditor />,
+  "/notification/kakao-alimtalk/history/create": <AdminNotificationHistoryCreate app="notification/kakao-alimtalk" />,
+  "/notification/kakao-alimtalk/history/:id": <AdminNotificationHistoryEditor app="notification/kakao-alimtalk" />,
+  "/notification/sms/template/create": <AdminSMSTemplateEditor />,
+  "/notification/sms/template/:id": <AdminSMSTemplateEditor />,
+  "/notification/sms/history/create": <AdminNotificationHistoryCreate app="notification/sms" />,
+  "/notification/sms/history/:id": <AdminNotificationHistoryEditor app="notification/sms" />,
+  "/external-api/google/oauth2/create": <AdminGoogleOAuth2Editor />,
+  "/external-api/google/oauth2/:id": <AdminGoogleOAuth2Editor />,
   "/file/publicfile/create": <PublicFileUploadPage />,
   "/file/publicfile/:id": <AdminEditorModifyRoutePage app="file" resource="publicfile" notModifiable notDeletable />,
   "/user/userext": <AdminList app="user" resource="userext" hideCreatedAt hideUpdatedAt />,
diff --git a/packages/common/src/apis/admin_api.ts b/packages/common/src/apis/admin_api.ts
index f3544fc..b43a9b7 100644
--- a/packages/common/src/apis/admin_api.ts
+++ b/packages/common/src/apis/admin_api.ts
@@ -2,6 +2,7 @@ import { BackendAPIClient } from "./client";
 import {
   AdminSchemaDefinition,
   ChoicesResponse,
+  GoogleOAuth2AccessTokenResponseSchema,
   ModificationAuditPreviewSchema,
   ModificationAuditSchema,
   OpenAPISchema,
@@ -105,3 +106,20 @@ export const previewModificationAudit =
   <T>(client: BackendAPIClient, id: string) =>
   () =>
     client.get<ModificationAuditPreviewSchema<T>>(`v1/admin-api/modification-audit/modification-audit/${id}/preview/`);
+
+export const renderTemplate =
+  (client: BackendAPIClient, app: string, resource: string) =>
+  ({ id, context }: { id: string; context: Record<string, unknown> }) =>
+    client.post<string, { context: Record<string, unknown> }>(`v1/admin-api/${app}/${resource}/${id}/render/`, { context });
+
+export const retryHistory = (client: BackendAPIClient, app: string, resource: string, id: string) => () =>
+  client.post<unknown, undefined>(`v1/admin-api/${app}/${resource}/${id}/retry/`, undefined);
+
+export const retrySentTo = (client: BackendAPIClient, app: string, resource: string, id: string, sentToId: string) => () =>
+  client.post<unknown, undefined>(`v1/admin-api/${app}/${resource}/${id}/sent-to/${sentToId}/retry/`, undefined);
+
+export const renderSentTo = (client: BackendAPIClient, app: string, resource: string, id: string, sentToId: string) => () =>
+  client.get<string>(`v1/admin-api/${app}/${resource}/${id}/sent-to/${sentToId}/render/`);
+
+export const issueGoogleOAuth2AccessToken = (client: BackendAPIClient, id: string) => () =>
+  client.post<GoogleOAuth2AccessTokenResponseSchema, undefined>(`v1/admin-api/external-api/google/oauth2/${id}/access-token/`, undefined);
diff --git a/packages/common/src/hooks/useAdminAPI.ts b/packages/common/src/hooks/useAdminAPI.ts
index 43eba86..0ce891e 100644
--- a/packages/common/src/hooks/useAdminAPI.ts
+++ b/packages/common/src/hooks/useAdminAPI.ts
@@ -1,4 +1,4 @@
-import { useMutation, useSuspenseQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useSuspenseQuery } from "@tanstack/react-query";
 
 import { useBackendContext } from "./useAPI";
 import * as BackendAdminAPIs from "../apis/admin_api";
@@ -13,6 +13,7 @@ const QUERY_KEYS = {
   ADMIN_CHOICES: ["query", "admin", "choices"],
   ADMIN_OPENAPI_SCHEMA: ["query", "admin", "openapi-schema"],
   ADMIN_PREVIEW_MODIFICATION_AUDIT: ["query", "admin", "retrieve", "modification-audit"],
+  ADMIN_RENDER_SENT_TO: ["query", "admin", "render-sent-to"],
 };
 
 const MUTATION_KEYS = {
@@ -25,6 +26,10 @@ const MUTATION_KEYS = {
   ADMIN_REMOVE: ["mutation", "admin", "remove"],
   ADMIN_APPROVE_MODIFICATION_AUDIT: ["mutation", "admin", "approve", "modification-audit"],
   ADMIN_REJECT_MODIFICATION_AUDIT: ["mutation", "admin", "reject", "modification-audit"],
+  ADMIN_RENDER_TEMPLATE: ["mutation", "admin", "render-template"],
+  ADMIN_RETRY_HISTORY: ["mutation", "admin", "retry-history"],
+  ADMIN_RETRY_SENT_TO: ["mutation", "admin", "retry-sent-to"],
+  ADMIN_ISSUE_GOOGLE_OAUTH2_ACCESS_TOKEN: ["mutation", "admin", "google-oauth2-access-token"],
 };
 
 export const useBackendAdminClient = () => {
@@ -164,3 +169,36 @@ export const useRejectModificationAuditMutation = (client: BackendAPIClient, id:
     mutationKey: MUTATION_KEYS.ADMIN_REJECT_MODIFICATION_AUDIT,
     mutationFn: BackendAdminAPIs.rejectModificationAudit(client, id),
   });
+
+export const useRenderTemplateMutation = (client: BackendAPIClient, app: string, resource: string) =>
+  useMutation({
+    mutationKey: [...MUTATION_KEYS.ADMIN_RENDER_TEMPLATE, app, resource],
+    mutationFn: BackendAdminAPIs.renderTemplate(client, app, resource),
+    meta: { invalidates: [] },
+  });
+
+export const useRetryHistoryMutation = (client: BackendAPIClient, app: string, resource: string, id: string) =>
+  useMutation({
+    mutationKey: [...MUTATION_KEYS.ADMIN_RETRY_HISTORY, app, resource, id],
+    mutationFn: BackendAdminAPIs.retryHistory(client, app, resource, id),
+  });
+
+export const useRetrySentToMutation = (client: BackendAPIClient, app: string, resource: string, id: string, sentToId: string) =>
+  useMutation({
+    mutationKey: [...MUTATION_KEYS.ADMIN_RETRY_SENT_TO, app, resource, id, sentToId],
+    mutationFn: BackendAdminAPIs.retrySentTo(client, app, resource, id, sentToId),
+  });
+
+export const useRenderSentToQuery = (client: BackendAPIClient, app: string, resource: string, id: string, sentToId: string | null) =>
+  useQuery({
+    queryKey: [...QUERY_KEYS.ADMIN_RENDER_SENT_TO, app, resource, id, sentToId],
+    queryFn: BackendAdminAPIs.renderSentTo(client, app, resource, id, sentToId ?? ""),
+    enabled: !!sentToId,
+  });
+
+export const useIssueGoogleOAuth2AccessTokenMutation = (client: BackendAPIClient, id: string) =>
+  useMutation({
+    mutationKey: [...MUTATION_KEYS.ADMIN_ISSUE_GOOGLE_OAUTH2_ACCESS_TOKEN, id],
+    mutationFn: BackendAdminAPIs.issueGoogleOAuth2AccessToken(client, id),
+    meta: { invalidates: [] },
+  });
diff --git a/packages/common/src/schemas/backendAdminAPI.ts b/packages/common/src/schemas/backendAdminAPI.ts
index 57d0c2d..a32accb 100644
--- a/packages/common/src/schemas/backendAdminAPI.ts
+++ b/packages/common/src/schemas/backendAdminAPI.ts
@@ -151,3 +151,14 @@ export type OpenAPIParameterSchema = {
 };
 
 export type OpenAPISchema = { paths: Record<string, { get?: { parameters?: OpenAPIParameterSchema[] } }> };
+
+export type GoogleOAuth2AccessTokenResponseSchema = {
+  is_valid: boolean;
+  access_token: string | null;
+  token_type: string | null;
+  expires_in: number | null;
+  scopes: string[];
+  email: string | null;
+  audience: string | null;
+  error: string | null;
+};