Better Auth Organizations – The Basics (Part 1)
- Better Auth 조직 기능의 기본 구현으로, 조직 생성 폼과 전환기 제작에 중점을 둡니다. 🎯
- Better Auth 스타터 프로젝트를 기반으로 시작하며,
o.ts에 organization 플러그인을 추가합니다. 🚀🔌
- Drizzle ORM 사용 시
npx better-o cli generate로 새 스키마를 생성하고, schema.ts에 통합 후 drizzle-kit push로 마이그레이션합니다. ⚙️📋💾
- 클라이언트 측
o-client.ts에 organizationClient 플러그인을 추가합니다. 🌐
- Better Auth API를 활용하여 새 조직을 생성하며, 생성자가 자동으로 소유자로 설정됩니다. ✨
shadcn/ui와 react-hook-form, zod를 이용해 조직 생성 폼(이름, 슬러그)을 구현하고, try-catch 및 토스트 알림을 적용합니다. 📝✅
- 데이터베이스(Neon)에서 조직 및 멤버십 생성을 확인하여 기능 작동을 검증합니다. 🧐
- 현재 로그인한 사용자의 모든 조직을 가져오는 서버 액션(
getOrganizations)을 구현합니다. 이는 서버 컴포넌트에서 캐싱 이점이 있어 선호됩니다. 🧑💻🔑
- 헤더에
shadcn/ui의 Select 컴포넌트로 조직 전환기를 만듭니다. 🔄
- 조직 전환기는
oClient.setActiveOrganization API를 사용하므로 클라이언트 컴포넌트로 구현됩니다. 🖥️➡️
useActiveOrganization 훅을 사용하여 현재 활성 조직을 가져와 표시합니다. 👁️
데브허브 | DEVHUB | Better Auth Organizations – The Basics (Part 1)