nextjs clerk 설정 페이지

일단 설정 url이 맞게 나오는지 간단한 페이지를 만들어요. /app/(platform)/(dashboard)/organization/[organizationId]/settings/page.tsx OrganizationProfile을 불러오고 사용자정의 css를 적용합니다.

nextjs 모바일 메뉴 팝업 sidebar

상태관리 모듈 중 하나인 zustand 설치합니다. shadcn-ui에 있는 sheet 콤포넌트 설치합니다. sheet로 나타나도록 할 것입니다. zustand를 사용하여 모바일 상태관리 추가합니다. /books/use-mobile-sidebar.ts 기존 navbar.tsx에서 모바일부분이라고 메모한 부분에 MobileSidebar추가합니다. /app/(platform/(dashboard)/_components/navbar.tsx mobile-sidebar 영역 생성합니다. /app/(platform/(dashboard)/_components/mobile-sidebar.tsx 새로고침하면 오류 나지 않도록 useEffect이용해서 로딩 끝나면 return 되도록 한다. 버턴을 누르면 사이드바가 나오도록 추가합니다. 기존 사이드바에 스켈레톤으로 로딩 표시합니다. /app/(platform)/(dashboard)/_components/sidebar.tsx nav-item 부분에도 … Read more