{"id":883,"date":"2026-05-20T09:51:51","date_gmt":"2026-05-20T01:51:51","guid":{"rendered":"https:\/\/junai.ai\/blog\/nextjs-server-actions-9\/"},"modified":"2026-05-20T09:51:51","modified_gmt":"2026-05-20T01:51:51","slug":"nextjs-server-actions-9","status":"publish","type":"post","link":"https:\/\/junai.ai\/blog\/nextjs-server-actions-9\/","title":{"rendered":"Server Actions \u2014 \uc11c\ubc84 \ud568\uc218\ub97c \ud3fc\uc5d0\uc11c \ubc14\ub85c"},"content":{"rendered":"\n<!-- WordPress REST API \ubc1c\ud589\uc6a9 HTML (\uc790\ub3d9 \uc0dd\uc131) -->\n<!-- WP-FEATURED-MEDIA-ID: 829 -->\n<div style=\"max-width:800px;margin:0 auto;\">\n<style>\n:root {--color-primary:#4f46e5;--color-accent:#6366f1;--color-bg:#fafbfc;--color-bg-card:#fff;--color-text:#1a202c;--color-text-muted:#64748b;--hero-start:#1e1b4b;--hero-end:#4338ca;}\n*{box-sizing:border-box;}\n.container{max-width:760px;margin:0 auto;padding:0 24px 80px;}\n.hero{background:linear-gradient(135deg,var(--hero-start) 0%,var(--hero-end) 100%);color:#fff;padding:80px 24px 60px;text-align:center;}\n.hero .eyebrow{display:inline-block;font-size:14px;color:#a78bfa;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-bottom:14px;}\n.hero h1{font-size:36px;margin:0 0 16px;line-height:1.3;font-weight:800;}\n.hero p{color:#c7d2fe;font-size:18px;max-width:640px;margin:0 auto;line-height:1.6;}\n.hero img{width:100%;max-width:640px;height:auto;margin:32px auto 0;border-radius:10px;display:block;}\narticle{padding-top:48px;}\narticle h2{font-size:26px;margin:56px 0 20px;padding-left:14px;border-left:5px solid var(--color-accent);line-height:1.4;}\narticle h3{font-size:19px;margin:32px 0 12px;color:var(--color-primary);}\narticle p{margin:16px 0;}\narticle strong{color:var(--color-primary);font-weight:700;}\narticle code{background:#eef2ff;padding:2px 8px;border-radius:4px;font-family:'SF Mono',Menlo,Consolas,monospace;font-size:14px;color:#4338ca;}\n.databox{background:#eef2ff;border-left:4px solid var(--color-accent);padding:16px 20px;margin:24px 0;border-radius:0 8px 8px 0;font-size:15.5px;}\n.databox strong{color:var(--color-primary);}\n.warnbox{background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);padding:16px 20px;margin:24px 0;border-radius:8px;font-size:15.5px;}\n.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:22px 0;}\ntable{width:100%;border-collapse:collapse;font-size:15px;background:var(--color-bg-card);}\nth,td{padding:11px 12px;text-align:left;border-bottom:1px solid #e2e8f0;vertical-align:top;}\nth{background:#f1f5f9;font-weight:700;color:#0f172a;}\ntd:first-child,th:first-child{font-weight:700;}\n@media (max-width:560px){.tablewrap table,.tablewrap thead,.tablewrap tbody,.tablewrap tr,.tablewrap th,.tablewrap td{display:block;width:auto;}.tablewrap thead{display:none;}.tablewrap tr{margin:0 0 14px;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden;}.tablewrap td{border:none;border-bottom:1px solid #f1f5f9;padding:9px 14px;}.tablewrap td:first-child{background:#f1f5f9;font-weight:800;font-size:15.5px;}.tablewrap td:last-child{border-bottom:none;}.tablewrap td[data-label]::before{content:attr(data-label) \" \u2014 \";font-weight:700;color:var(--color-primary);}}\n.code-block{background:#0f172a;color:#e2e8f0;padding:16px 20px;border-radius:8px;font-family:'SF Mono',Menlo,Consolas,monospace;font-size:14px;line-height:1.6;margin:20px 0;overflow-x:auto;white-space:pre;}\n.cta{background:linear-gradient(135deg,#4f46e5 0%,#6366f1 100%);color:#fff;padding:28px 24px;border-radius:12px;margin:48px 0 0;text-align:center;}\n.cta h3{color:#fff;margin:0 0 8px;font-size:20px;}\n.cta p{color:#c7d2fe;margin:0;font-size:15.5px;}\n.footer-nav{margin-top:32px;padding-top:20px;border-top:1px solid #e2e8f0;font-size:14px;color:var(--color-text-muted);}\n.footer-nav a{color:var(--color-primary);text-decoration:none;}\n@media (max-width:480px){.hero h1{font-size:26px;}.hero p{font-size:16px;}article h2{font-size:21px;}article h3{font-size:17px;}body{font-size:16px;}}\n<\/style>\n<section class=\"hero\">\n  <span class=\"eyebrow\">Next.js \uad50\uc7ac \u00b7 9\ud3b8 \u00b7 Server Actions<\/span>\n  <h1>Server Actions \u2014 \uc11c\ubc84 \ud568\uc218\ub97c \ud3fc\uc5d0\uc11c \ubc14\ub85c<\/h1>\n  <p>API \ub77c\uc6b0\ud2b8 \uc5c6\uc774\ub3c4 mutation. fetch\u00b7useState\u00b7loading \ubd84\uae30\uac00 \uc0ac\ub77c\uc9c4\ub2e4.<\/p>\n  <img decoding=\"async\" src=\"https:\/\/junai.ai\/blog\/wp-content\/uploads\/2026\/05\/hero-5-62.jpg\" alt=\"\ud074\ub77c\uc774\uc5b8\ud2b8 \ud3fc\uc774 \uc11c\ubc84 \ud568\uc218\ub97c \ubc14\ub85c \ud638\ucd9c\ud558\ub294 \ucee8\uc149 \uc77c\ub7ec\uc2a4\ud2b8\">\n<\/section>\n\n<div class=\"container\">\n<article>\n\n<p>8\ud3b8\uc5d0\uc120 \ub370\uc774\ud130 <strong>\uc77d\uae30<\/strong>\ub97c \ubd24\ub2e4. \uc774\ubc88 \ud3b8\uc740 \ub370\uc774\ud130 <strong>\uc4f0\uae30<\/strong>. \uc61b React \uc5d0\uc120 \ud3fc \uc81c\ucd9c\ud558\ub824\uba74 \u2014 <code>onSubmit<\/code> \ud578\ub4e4\ub7ec\uc5d0 <code>e.preventDefault()<\/code> \u00b7 <code>fetch('\/api\/posts', {method:'POST'})<\/code> \u00b7 \uc751\ub2f5 \ubc1b\uc544 <code>setState<\/code> \u00b7 \uc5d0\ub7ec\u00b7\ub85c\ub529 \ubd84\uae30. 10\uc904 \ub118\ub294\ub2e4.<\/p>\n\n<p>App Router \uc758 \ub2f5\uc774 <strong>Server Actions<\/strong>. <code>'use server'<\/code> \ud55c \uc904 \uc801\uc740 \uc11c\ubc84 \ud568\uc218\ub97c \ud074\ub77c\uc774\uc5b8\ud2b8 \ud3fc\u00b7\ubc84\ud2bc\uc774 <strong>\uc9c1\uc811 \ud638\ucd9c<\/strong>. API \uc5d4\ub4dc\ud3ec\uc778\ud2b8 \ub9cc\ub4e4\uc9c0 \uc54a\uace0\ub3c4 DB \uc5d0 \uc4f0\ub294 \uac8c \uac00\ub2a5\ud558\ub2e4. 2024 \ub144\uc5d0 stable \ub410\uace0 2026 \uae30\uc900 Next \ud480\uc2a4\ud0dd\uc758 \ud45c\uc900.<\/p>\n\n<h2>1. \uac00\uc7a5 \ub2e8\uc21c\ud55c Server Action<\/h2>\n\n<p>\ub450 \uac00\uc9c0 \ud615\ud0dc. \uc778\ub77c\uc778 \ub610\ub294 \ubcc4\ub3c4 \ud30c\uc77c.<\/p>\n\n<h3>\uc778\ub77c\uc778 \u2014 \ud55c \ud30c\uc77c \uc548\uc5d0\uc11c<\/h3>\n\n<div class=\"code-block\">\/\/ app\/contact\/page.tsx (\uc11c\ubc84 \ucef4\ud3ec\ub10c\ud2b8)\nimport { redirect } from &#8216;next\/navigation&#8217;;\nimport { db } from &#8216;@\/lib\/db&#8217;;\n\nexport default function ContactPage() {\n  async function submit(formData: FormData) {\n    &#8216;use server&#8217;;                    \/\/ \u2190 \uc774 \ud55c \uc904\uc774 \ud575\uc2ec\n    const email = formData.get(&#8217;email&#8217;);\n    const message = formData.get(&#8216;message&#8217;);\n    await db.contacts.create({ email, message });\n    redirect(&#8216;\/thank-you&#8217;);\n  }\n\n  return (\n    &lt;form action={submit}&gt;\n      &lt;input name=&#8221;email&#8221; type=&#8221;email&#8221; required \/&gt;\n      &lt;textarea name=&#8221;message&#8221; required \/&gt;\n      &lt;button&gt;\ubcf4\ub0b4\uae30&lt;\/button&gt;\n    &lt;\/form&gt;\n  );\n}<\/div>\n\n<p>\ube44\uacb0\uc740 <code>&lt;form action={submit}&gt;<\/code> \uc758 <code>action<\/code> \uc18d\uc131. HTML \ud45c\uc900\uc774\uc9c0\ub9cc Next \uac00 \ud568\uc218 \ucc38\uc870\uae4c\uc9c0 \ubc1b\uc544\uc900\ub2e4. \uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8\uac00 \uaebc\uc9c4 \ube0c\ub77c\uc6b0\uc800\uc5d0\uc11c\ub3c4 \ub3d9\uc791\ud55c\ub2e4 (progressive enhancement).<\/p>\n\n<h3>\ubcc4\ub3c4 \ud30c\uc77c \u2014 &#8216;use server&#8217; \ub97c \ucd5c\uc0c1\ub2e8\uc5d0<\/h3>\n\n<div class=\"code-block\">\/\/ lib\/actions.ts\n&#8216;use server&#8217;;\nimport { db } from &#8216;@\/lib\/db&#8217;;\n\nexport async function createPost(formData: FormData) {\n  const title = formData.get(&#8216;title&#8217;);\n  const body = formData.get(&#8216;body&#8217;);\n  await db.posts.create({ title, body });\n}\n\n\/\/ app\/blog\/new\/page.tsx\nimport { createPost } from &#8216;@\/lib\/actions&#8217;;\nexport default function NewPostPage() {\n  return (\n    &lt;form action={createPost}&gt;\n      \u2026\n    &lt;\/form&gt;\n  );\n}<\/div>\n\n<p>\uc5ec\ub7ec \ud398\uc774\uc9c0\uc5d0\uc11c \uac19\uc740 action \uc744 \uc7ac\uc0ac\uc6a9\ud560 \ub54c \ubcc4\ub3c4 \ud30c\uc77c\uc774 \uae54\ub054. \ud30c\uc77c \ucd5c\uc0c1\ub2e8\uc758 <code>'use server'<\/code> \uac00 \ud30c\uc77c \uc804\uccb4\ub97c server-only \ub85c \ud45c\uc2dc\ud55c\ub2e4.<\/p>\n\n<h2>2. Server Action \uc758 \uc815\uccb4<\/h2>\n\n<p>\ub9c8\ubc95\ucc98\ub7fc \ubcf4\uc774\uc9c0\ub9cc \uc2e4\uc740 Next \uac00 <strong>\uc790\ub3d9\uc73c\ub85c RPC \uc5d4\ub4dc\ud3ec\uc778\ud2b8\ub97c \ub9cc\ub4e4\uc5b4\uc900\ub2e4<\/strong>. \ube4c\ub4dc \ud0c0\uc784\uc5d0 \ud568\uc218 ID \uac00 \ubc1c\uae09\ub418\uace0, \ud074\ub77c\uc774\uc5b8\ud2b8\uc758 \ud3fc \uc81c\ucd9c\uc740 \uadf8 ID \ub85c POST \ud638\ucd9c\uc774 \uc790\ub3d9\uc73c\ub85c \uc77c\uc5b4\ub09c\ub2e4. \uac1c\ubc1c\uc790\ub294 \uadf8\uac78 \uc758\uc2dd \uc548 \ud574\ub3c4 \ub428.<\/p>\n\n<div class=\"tablewrap\">\n<table>\n<thead><tr><th>\uad6c\ubd84<\/th><th>\uc61b API Route<\/th><th>Server Action<\/th><\/tr><\/thead>\n<tbody>\n<tr><td>\ucf54\ub4dc \uc704\uce58<\/td><td data-label=\"API\"><code>app\/api\/posts\/route.ts<\/code><\/td><td data-label=\"Action\">\uc544\ubb34 \uc11c\ubc84 \ud30c\uc77c<\/td><\/tr>\n<tr><td>\ud638\ucd9c \ubc29\ubc95<\/td><td data-label=\"API\">\ud074\ub77c\uc774\uc5b8\ud2b8\uac00 fetch<\/td><td data-label=\"Action\"><code>&lt;form action={fn}&gt;<\/code><\/td><\/tr>\n<tr><td>\ud0c0\uc785 \uc548\uc804\uc131<\/td><td data-label=\"API\">JSON \uc9c1\ub82c\ud654 \ud6c4 \uc190\uc2e4<\/td><td data-label=\"Action\">\ud568\uc218 \uc2dc\uadf8\ub2c8\ucc98 \uadf8\ub300\ub85c<\/td><\/tr>\n<tr><td>JS \uaebc\uc84c\uc744 \ub54c<\/td><td data-label=\"API\">\ub3d9\uc791 \uc548 \ud568<\/td><td data-label=\"Action\">\ud45c\uc900 \ud3fc\uc73c\ub85c \ub3d9\uc791<\/td><\/tr>\n<tr><td>\ub85c\ub529 \uc0c1\ud0dc<\/td><td data-label=\"API\"><code>useState<\/code> \uc9c1\uc811<\/td><td data-label=\"Action\"><code>useFormStatus<\/code> \ub610\ub294 \uc790\ub3d9<\/td><\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n\n<h2>3. useActionState \u2014 \uacb0\uacfc\u00b7\uc5d0\ub7ec \ucc98\ub9ac<\/h2>\n\n<p>\uc2e4\uc804\uc5d0\uc120 \uc131\uacf5\u00b7\uc2e4\ud328 \uba54\uc2dc\uc9c0\ub97c \ubcf4\uc5ec\uc918\uc57c \ud55c\ub2e4. <code>useActionState<\/code> \ud6c5\uc774 \uadf8 \uc5ed\ud560.<\/p>\n\n<div class=\"code-block\">\/\/ app\/contact\/contact-form.tsx\n&#8216;use client&#8217;;\nimport { useActionState } from &#8216;react&#8217;;\nimport { submitContact } from &#8216;.\/actions&#8217;;\n\nconst initial = { ok: false, error: &#8221; };\n\nexport default function ContactForm() {\n  const [state, formAction, pending] = useActionState(submitContact, initial);\n  return (\n    &lt;form action={formAction}&gt;\n      &lt;input name=&#8221;email&#8221; required \/&gt;\n      &lt;textarea name=&#8221;message&#8221; required \/&gt;\n      &lt;button disabled={pending}&gt;{pending ? &#8216;\uc804\uc1a1 \uc911\u2026&#8217; : &#8216;\ubcf4\ub0b4\uae30&#8217;}&lt;\/button&gt;\n      {state.error &#038;&#038; &lt;p className=&#8221;error&#8221;&gt;{state.error}&lt;\/p&gt;}\n      {state.ok &#038;&#038; &lt;p className=&#8221;ok&#8221;&gt;\uac10\uc0ac\ud569\ub2c8\ub2e4!&lt;\/p&gt;}\n    &lt;\/form&gt;\n  );\n}\n\n\/\/ app\/contact\/actions.ts\n&#8216;use server&#8217;;\nexport async function submitContact(prev: any, formData: FormData) {\n  const email = formData.get(&#8217;email&#8217;);\n  if (!email) return { ok: false, error: &#8216;\uc774\uba54\uc77c\uc744 \uc785\ub825\ud558\uc138\uc694.&#8217; };\n  try {\n    await db.contacts.create({ email });\n    return { ok: true, error: &#8221; };\n  } catch (e) {\n    return { ok: false, error: &#8216;\uc800\uc7a5 \uc2e4\ud328. \ub2e4\uc2dc \uc2dc\ub3c4\ud574\uc8fc\uc138\uc694.&#8217; };\n  }\n}<\/div>\n\n<p>\uc561\uc158 \ud568\uc218\uc758 \uc2dc\uadf8\ub2c8\ucc98\uac00 <code>(prev, formData)<\/code> \ub85c \ubc14\ub00c\ub294 \uac8c \ud3ec\uc778\ud2b8. \uc774\uc804 \uc0c1\ud0dc\ub97c \ubc1b\uc544 \uc0c8 \uc0c1\ud0dc\ub97c \ubc18\ud658. <code>pending<\/code> \uc73c\ub85c \uc9c4\ud589 \uc911 \ubc84\ud2bc disable \uac19\uc740 UX \uae4c\uc9c0 \ud55c \ubc88\uc5d0.<\/p>\n\n<h2>4. revalidatePath \/ redirect \u2014 mutation \ub4a4 \ucc98\ub9ac<\/h2>\n\n<p>\uc4f0\uae30\uac00 \ub05d\ub098\uba74 \ubcf4\ud1b5 \ub450 \uac00\uc9c0\ub97c \ud574\uc57c \ud55c\ub2e4 \u2014 <strong>\uad00\ub828 \uce90\uc2dc \ubb34\ud6a8\ud654<\/strong> \uc640 <strong>\ub2e4\ub978 \ud398\uc774\uc9c0\ub85c \uc774\ub3d9<\/strong>.<\/p>\n\n<div class=\"code-block\">&#8216;use server&#8217;;\nimport { revalidatePath } from &#8216;next\/cache&#8217;;\nimport { redirect } from &#8216;next\/navigation&#8217;;\n\nexport async function publishPost(formData: FormData) {\n  const post = await db.posts.create({\n    title: formData.get(&#8216;title&#8217;),\n    body: formData.get(&#8216;body&#8217;),\n  });\n  revalidatePath(&#8216;\/blog&#8217;);           \/\/ \/blog \uce90\uc2dc \ud3d0\uae30\n  redirect(`\/blog\/${post.slug}`);    \/\/ \uc0c8 \uae00\ub85c \uc774\ub3d9\n}<\/div>\n\n<p><code>revalidatePath<\/code> \ub294 8\ud3b8\uc5d0\uc11c \ub2e4\ub918\ub358 <code>fetch<\/code> \uce90\uc2dc\u00b7\ud398\uc774\uc9c0 \uce90\uc2dc\ub97c \ub3d9\uc2dc\uc5d0 \ubb34\ud6a8\ud654. <code>redirect<\/code> \ub294 \uc561\uc158 \ub05d\ub09c \ub4a4 \ud074\ub77c\uc774\uc5b8\ud2b8\ub97c \ub2e4\ub978 URL \ub85c \ubcf4\ub0b8\ub2e4. \ub450 \uc904\ub85c &#8220;\uc37c\ub2e4 \u2192 \uac31\uc2e0 \u2192 \uc774\ub3d9&#8221; \ud750\ub984 \ub05d.<\/p>\n\n<h2>5. \ubcf4\uc548\uacfc \ud568\uc815<\/h2>\n\n<div class=\"warnbox\">\n<strong>Server Action \uc740 \uacf5\uac1c \uc5d4\ub4dc\ud3ec\uc778\ud2b8<\/strong> \u2014 \uc790\ub3d9\uc73c\ub85c RPC \uac00 \ub9cc\ub4e4\uc5b4\uc9c4\ub2e4\ub294 \uac74, \ub204\uad6c\ub098 \uadf8 URL \uc744 \uc54c\uba74 \ud638\ucd9c\ud560 \uc218 \uc788\ub2e4\ub294 \ub73b. <strong>\uc561\uc158 \uc548\uc5d0\uc11c \uc9c1\uc811 \uc778\uc99d \uac80\uc0ac\ub97c \ud574\uc57c \uc548\uc804<\/strong>. \ud074\ub77c\uc774\uc5b8\ud2b8 \ud3fc \uc548 \uac70\uce58\uace0 cURL \ub85c \ud638\ucd9c\ud558\ub294 \uc2dc\ub098\ub9ac\uc624 \ud56d\uc0c1 \uac00\uc815.\n<\/div>\n\n<div class=\"code-block\">&#8216;use server&#8217;;\nimport { auth } from &#8216;@\/lib\/auth&#8217;;\n\nexport async function deletePost(id: string) {\n  const session = await auth();\n  if (!session?.user.isAdmin) {\n    throw new Error(&#8216;\uad8c\ud55c \uc5c6\uc74c&#8217;);\n  }\n  await db.posts.delete({ id });\n}<\/div>\n\n<p>\ub2e4\ub978 \ud754\ud55c \ud568\uc815:<\/p>\n\n<ul>\n<li><strong>FormData \uc758 \uac12\uc740 string<\/strong> \ub610\ub294 File. \uc22b\uc790\ub294 \uc9c1\uc811 <code>Number()<\/code> \ubcc0\ud658. Zod \uac19\uc740 \uac80\uc99d \ub77c\uc774\ube0c\ub7ec\ub9ac \uad8c\uc7a5.<\/li>\n<li><strong>\uc561\uc158\uc740 \ud074\ub77c\uc774\uc5b8\ud2b8\ub85c \uc808\ub300 import \uae08\uc9c0<\/strong> \u2014 \uc790\ub3d9 RPC \ubcc0\ud658\uc774 \uc548 \ub428. \ud56d\uc0c1 props \ub610\ub294 \ubcc4\ub3c4 import.<\/li>\n<li><strong>\uc608\uc678\ub294 \ud074\ub77c\uc774\uc5b8\ud2b8\ub85c \ub178\ucd9c\ub428<\/strong> \u2014 <code>throw new Error('DB password wrong')<\/code> \uac19\uc740 \ub514\ubc84\uadf8 \uba54\uc2dc\uc9c0 \ub358\uc9c0\uba74 \uadf8\ub300\ub85c \ud074\ub77c\uc774\uc5b8\ud2b8\ub85c \uc804\ub2ec\ub428. \uc0ac\uc6a9\uc790\uc6a9 \uba54\uc2dc\uc9c0\ub85c \ub2e4\ub4ec\uc744 \uac83.<\/li>\n<\/ul>\n\n<h3>\uc694\uc57d \u2014 9\ud3b8 \uc88c\ud45c<\/h3>\n\n<p>\uc5ec\uae30\uae4c\uc9c0 \uc815\ub9ac. <strong>Server Actions<\/strong> \u2014 <code>'use server'<\/code> \uc801\ud78c \ud568\uc218\ub97c \ud074\ub77c\uc774\uc5b8\ud2b8 \ud3fc\u00b7\ubc84\ud2bc\uc774 \uc9c1\uc811 \ud638\ucd9c. \uc778\ub77c\uc778 \ub610\ub294 \ubcc4\ub3c4 \ud30c\uc77c. <code>useActionState<\/code> \ub85c \uacb0\uacfc\u00b7\uc5d0\ub7ec\u00b7pending \ucc98\ub9ac, <code>revalidatePath<\/code>\u00b7<code>redirect<\/code> \ub85c mutation \ud6c4 \ucc98\ub9ac. \uc561\uc158\uc740 \uacf5\uac1c \uc5d4\ub4dc\ud3ec\uc778\ud2b8\ub77c \uc778\uc99d\u00b7\uac80\uc99d\uc740 \ud568\uc218 \uc548\uc5d0\uc11c \uc9c1\uc811. \ub2e4\uc74c \ud3b8\uc5d0\uc11c <strong>\ud3fc\uacfc \ubba4\ud14c\uc774\uc158<\/strong> \ud328\ud134\uc744 \uc2e4\uc804 \uc608\uc81c\ub85c \ubb36\ub294\ub2e4.<\/p>\n\n<div class=\"cta\">\n<h3>\ub2e4\uc74c \ud3b8 \uc608\uace0 \u2014 \ud3fc\uacfc \ubba4\ud14c\uc774\uc158 \uc2e4\uc804<\/h3>\n<p>useActionState\u00b7revalidatePath\u00b7\ub099\uad00\uc801 \uc5c5\ub370\uc774\ud2b8. 10\ud3b8.<\/p>\n<\/div>\n\n<div class=\"footer-nav\">\n\uc2dc\ub9ac\uc988 \u00b7 <a href=\"https:\/\/junai.ai\/blog\/category\/nextjs\/\">\uc27d\uac8c \ubc30\uc6b0\ub294 Next.js<\/a> \u00b7 \uc774\uc804: <a href=\"https:\/\/junai.ai\/blog\/nextjs-data-fetching-server-8\/\">Ch.8 \ub370\uc774\ud130 \ud398\uce6d<\/a>\n<\/div>\n\n<\/article>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Next.js Server Actions \u2014 use server \ub85c \uc11c\ubc84 \ud568\uc218\ub97c \ud3fc\uc5d0\uc11c \ubc14\ub85c \ud638\ucd9c. API \uc5c6\uc774 mutation. \uad50\uc7ac 9\ud3b8.<\/p>\n","protected":false},"author":1,"featured_media":829,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23],"tags":[],"class_list":["post-883","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-nextjs"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/posts\/883","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/comments?post=883"}],"version-history":[{"count":0,"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/posts\/883\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/media\/829"}],"wp:attachment":[{"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/media?parent=883"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/categories?post=883"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/junai.ai\/blog\/wp-json\/wp\/v2\/tags?post=883"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}