- Next.js 15 서버 액션 분리: 클라이언트 컴포넌트에서 서버 액션을 분리하여 코드를 깔끔하게 정리하는 방법을 설명. 📁
- actions 폴더 생성 및 products.ts 파일 생성: 서버 액션을 위한 별도의 파일을 생성하여 관리. 📂
- use server 지시어 활용: 파일 상단에 use server 지시어를 사용하여 파일 내 모든 export를 서버 액션으로 지정. ⚙️
- formState 및 createProduct 함수 분리 및 export: 클라이언트 컴포넌트와 서버 액션 코드 분리. ➡️
- use action state 활용: 폼 상태 관리에 클라이언트 사이드 React hook 활용. 🎣
- 폼 유효성 검사 구현: 필수 필드 검증 및 에러 메시지 표시. ⚠️
- 서버 액션을 통한 데이터 변경: 데이터베이스에 새로운 상품 추가. ➕