요약: Server Actions
Coddy React 여정의 Next.js 핵심 (Next.js Essentials) 섹션에 포함된 레슨 — 47개 중 33번째.
챌린지
중급단원 요약: 아래 방명록은 아무것도 저장하지 않으며 절대 업데이트되지 않습니다. 전체 흐름을 작성하세요: form → action → 신규 페이지.
app/actions.js의 첫 번째 줄에'use server'를 명시하고, 저장 함수 호출 뒤에revalidatePath('/')('next/cache'에서 가져옴)를 호출하세요.app/page.jsx에서'./actions'로부터addGuest를import하고, input과 button을id="guest-form"및action={addGuest}속성을 가진<form>으로 감싸세요.- input에
name="name"을 부여하세요: action이formData.get('name')으로 읽어올key입니다.
직접 해보기
import './globals.css';
export const metadata = {
title: 'My App',
};
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
{children}
</body>
</html>
);
}