반응형 appwrite7 Jira-clone - Task 생성 모달 및 폼 구현 정리 https://www.youtube.com/watch?v=37v63U7-iG0&t=4s 1. useCreateTaskModal Hook 생성src/features/tasks/hooks/use-create-task-modal.tsimport {useQueryState, parseAsBoolean} from "nuqs"export const useCreateTaskModal = () => { const [isOpen, setIsOpen] = useQueryState( "create-task", parseAsBoolean.withDefault(false).withOptions({clearOnDefault:true}) ) const open = () => setIsOp.. 2025. 11. 5. Jira-clone - 서버 쿼리 리팩토링 파일구조src/features/auth/action.ts -> src/features/auth/queries.ts 로 변경 actions.ts: 서버 액션 (사용자 상호작용, form submission)queries.ts: 데이터 조회 (read-only 서버 함수) src/├── lib/│ └── appwrite.ts # ⭐ 클라이언트 팩토리 함수├── features/│ ├── auth/│ │ └── (action.ts 변경) queries.ts # getCurrent()│ ├── workspaces/│ │ └── (action.ts 변경) queries.ts # getWorkspaces(), getWorkspace() 특정 워크스페이.. 2025. 10. 11. Jira-clone - 워크스페이스 멤버십 시스템 만들기 https://www.youtube.com/watch?v=Av9C7xlV0fA05:22:41 1. Members 테이블 컬럼 구성Appwrite에서 members 테이블을 생성하고 다음 컬럼들을 추가userId: 사용자 ID (string, 50자, 필수)workspaceId: 워크스페이스 ID (string, 50자, 필수)role: 역할 (Enum: ADMIN/MEMBER, 필수) Users와 Workspaces를 연결하는 중간 테이블 (Many-to-Many 관계)한 사용자가 여러 워크스페이스에 속할 수 있고, 각각 다른 역할을 가질 수 있음 2. 환경 변수 설정 (.env.local), Config 파일 (src/config.ts).env.localNEXT_PUBLIC_APPWRITE_MEMBE.. 2025. 10. 2. Jira-clone - Workspace 목록 불러오기 https://www.youtube.com/watch?v=Av9C7xlV0fA5:04:39 전체 데이터 흐름1. 컴포넌트 렌더링 ↓2. React Query Hook 호출 useGetWorkspaces() - 캐시 확인 - 없으면 API 호출 ↓3. HTTP 요청 GET /api/workspaces (RPC 클라이언트 through Hono) ↓4. 서버 라우트 처리 route.ts - GET "/" databases.listDocuments() ↓5. Appwrite Database WORKSPACES_ID 컬렉션 조회 ↓6. 응답 반환 {data: {documents: [...], total: N}} ↓7. R.. 2025. 10. 1. Jira-clone - image 업로드 https://www.youtube.com/watch?v=Av9C7xlV0fA4:37:27 핵심 개념Storage: 실제 파일(이미지) 저장소Database: 파일의 "위치"(ID)를 기록FormData: File 객체를 서버로 전송하는 유일한 방법이미지를 보여줄 때는 imageUrl(파일 ID)로 Storage에서 실제 이미지를 가져오면 됨! 💡 전체 흐름 요약1. 사용자가 이미지 선택 ↓2. FormData로 서버에 전송 ↓3. Zod 스키마 검증 (File 또는 string) ↓4. Storage에 이미지 업로드 ↓5. 생성된 파일 ID 반환 ↓6. Database에 workspace 생성 (imageUrl 포함) * 스키마 정의 (src/features/workspaces/s.. 2025. 9. 29. Jira-clone - Appwrite로 워크스페이스 생성 기능 구현 https://www.youtube.com/watch?v=Av9C7xlV0fA04:07:07 프로젝트 구조src/├── app/│ ├── (dashboard)/│ │ └── page.tsx # 메인 대시보드 페이지│ └── api/│ └── [[...route]]/│ └── route.ts # API 라우트 통합 관리├── config.ts # 환경변수 중앙 관리├── features/│ └── workspaces/│ ├── api/ ### 클라이언트 API 호출│ │ └── use-create-workspace.ts # 클라.. 2025. 9. 26. 이전 1 2 다음 반응형
