use server 와 form action

Jake·2024년 3월 24일
0

서버에서 동작하는 작업은 "use server"; 지시문을 함수의 최상단에 입력하여 서버 작업으로 정의할 수 있습니다.

서버 액션을 form action과 함께 사용하여 submit 시 동작할 서버 작업을 구현할 수 있습니다.

// Server Component
const Page = () => {
  // Server Action
  const create = async (formData: FormData) => {
    "use server";
 
    // 서버 콘솔에 로그 작성
    console.log(formData.get("username"));
  }
 
  return (
    <form action={create}>
      <input type="text" name="username" />
      <button type="submit" />
    </form>
  )
}

참고

https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations

0개의 댓글