cult directory template
1.0.0
전체 스택 Nextjs + shadcn + supabase 템플릿
| 특징 | 무료 버전 | 유료 버전 |
|---|---|---|
| 다음 .js v13 | ✅ | ✅ |
| /앱 디렉토리 | ✅ | ✅ |
| 테일 윈드 CSS | ✅ | ✅ |
| Shadcn 구성 요소 | ✅ | ✅ |
| Vercel ai SDK | ✅ | ✅ |
| Supabase 통합 | ✅ | ✅ |
| 모바일 반응 | ✅ | ✅ |
| 제품 RSC를 제출하십시오 | ✅ | ✅ |
| 다크 및 라이트 모드 | ✅ | ✅ |
| 사용자 인증 | ✅ | ✅ |
| 제품 필터 | ✅ | ✅ |
| 사용자 정의 색상 테마 | ✅ | ✅ |
| 무료 업데이트 | ✅ | ✅ |
| 관리자 대시 보드 | ✅ | |
| 관리자 분석 | ✅ | |
| 대량 AI 데이터 농축 | ✅ | |
| 특허 | GPL-2.0 | 광고 |
| 가격 | 무료 | $ 119 |
컬트에 가입하십시오
컬트에 가입하면 다양한 프리미엄 템플릿에 평생 액세스 할 수 있습니다.
| 주형 | 설명 | 특징 | 링크 |
|---|---|---|---|
| 여행용 | 실시간 동기화 및 PWA 지원을 갖춘 오프라인 최초의 여행 앱은 여행 목표를 관리하고 계획하도록 설계되었습니다. | 오프라인 기능, 실시간 동기화, PWA 지원, Next.js, Tailwind CSS, Claude AI, RXDB Progressive Web App | 여행용 |
| 컬트 서 | 웹 사이트를 크롤링하고 SEO를 채점하고 AI 중심 개선을 제공하는 도구. | RSC 웹 스크래핑, 웹 생명, 구조화 된 AI 출력, Next.js, Tailwind CSS, Claude AI | 컬트 서 |
| 명백한 | 벡터 임베드 및 래그 검색으로 AI 앱을 운송하기위한 풀 스택 템플릿. | 벡터 임베딩, 헝겊 검색, Supabase, Next.js, Tailwind CSS, Open AI | 명백한 |
| 방문 페이지 | 설계 구독 방문 페이지. | 애니메이션, 독특한 탐색, Next.js, Tailwind CSS | 방문 페이지 |
| 백엔드 | 다양한 요구 사항을위한 다양한 백엔드 템플릿. | 다양한 사용 사례를위한 다양한 백엔드 솔루션 및 스 니펫. | 백엔드 |
이 템플릿 각각은 컬트 지사와 같이 완전한 설계 및 생산 준비가되어 있습니다. 컬트 스택은 다음으로, JS, Shadcn, Tailwind CSS, Supabase 및 Vercel AI SDK입니다.
잘 설계된 스타트 업을 빠르게 구축하고 출시 할 수 있도록 설계되었습니다.
온 보딩 비디오를보고 빠르게 회전하십시오
Mac : brew install supabase/tap/supabase
Windows :
scoop bucket add supabase https: // github.com / supabase / scoop - bucket.git
scoop install supabase Linux : brew install supabase/tap/supabase
NPM/BUN : npx supabase <command>
Supabase Dashboard 또는 CLI를 통해 Supabase 프로젝트를 만듭니다.
npx supabase projects create -i " your-saas-app "조직 ID는 조직을 선택한 후 URL에서 찾을 수 있습니다.
CLI를 프로젝트에 연결하십시오.
npx supabase init
npx supabase link방금 만든 프로젝트를 선택하십시오.
.env.local for next.js에 supabase url 및 public anon 키를 저장 .env.local for next.js에 Supabase URL 및 Public Anon Key를 저장하십시오.
NEXT_PUBLIC_SUPABASE_URL= < api-url >
NEXT_PUBLIC_SUPABASE_ANON_KEY= < anon-key >API 설정 페이지에서 프로젝트 API URL 및 익명 키를 얻을 수 있습니다.
DB 스키마 설정 :
이것은
supabase/migrations디렉토리에있는 모든 마이그레이션을 실행합니다.
supabase db push.env 변수가 올바르게 구성되었는지 확인하십시오 cp .env.local.example .env.local # Example Supabase Config
NEXT_PUBLIC_SUPABASE_URL= " https://examplesqnwerasdfaser.supabase.co "
SUPABASE_PROJECT_ID= " examplesqnwerasdfaser "
NEXT_PUBLIC_SUPABASE_ANON_KEY= " xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.. " 별도의 터미널에서 다음 명령을 실행하십시오.
pnpm ipnpm run dev브라우저에서 http : // localhost : 3000을 엽니 다.
Supabase의 기본 SMTP 속도 제한은 현재 매우 낮습니다.
제공자 이메일 - API 설정 페이지.
디렉토리에 신제품을 추가하려면 제출 페이지를 방문하십시오.
제품을 제출하십시오
이제 자신의 컬트 디렉토리를 구축하는 데 필요한 모든 데이터가 포함 된 완전히 시드 된 데이터베이스가 있습니다.
유료 버전 만
컬트에 가입하십시오
Supabase의 기본 SMTP 속도 제한은 현재 매우 낮습니다.
제공자 이메일 - API 설정 페이지.
이메일 확인이 필요한 경우 다음 안내서를 따르십시오
로그인
인증 사용자 테이블 API 설정 페이지에서 검색하십시오.
.env.local 에서 SUPABASE_ADMIN_ID 변수를 복사하여 SQL 편집기에 붙여 넣습니다.
Supabase API 설정 페이지의 SQL 편집기로 이동하십시오.
UPDATE auth . users
SET raw_app_meta_data = jsonb_set(
coalesce(raw_app_meta_data, ' {} ' ),
' {claims_admin} ' ,
' true ' ::jsonb
)
WHERE id = ' USER_UUID ' ; 사용자에게 관리자 권한을 할당하려면 다음 SQL 스크립트를 실행하십시오. 'USER_UUID' 인증 사용자 테이블에서 복사 한 동일한 사용자 ID로 바꾸십시오.
시드 스크립트는 매우 복잡합니다. 개요 문서 0.
supabase/seed/src/README.md및 각 단계마다 문서가 있습니다.
supabase/seed/src/stage-1-crawl/readme.mdsupabase/seed/src/stage-2-enrich/readme.mdsupabase/seed/src/stage-3-seed/readme.md나는 가능한 한 싸게 달리기 위해 노력했다. API 지원 수준에 따라 동시성 및 시간 초과 값을 사용하여 스크립트의 성능을 높일 수 있습니다.
supabase/seed/src/stage-2-enrich 실행하려면 .env.local 파일에 ANTHROPIC_API_KEY 또는 ANTHROPIC_API_KEY 가 필요합니다.
API 키가있는 경우 .env.local 파일에 복사하십시오.
supabase/seed/src/main.ts 에서 SEED_URLS 변수를 선택적으로 편집하여 긁어 내고 강화하려는 URL을 포함하십시오.
스크립트 실행 :
pnpm run enrich-seed API 키가없는 경우 이전 실행의 사전 풍부한 데이터 세트를 포함 시켰습니다. supabase/seed/src/stage-2-enrich/__data__/enriched-20240611T210738.json 에서 볼 수 있습니다.
키를 사용하여 강화하는 대신이 데이터 세트를 사용하려면 :
supabase/seed/src/main.ts 에서 파일을 엽니 다.
104 - 110 행을 언급하십시오.
// console.log("Step 1: Crawl and save raw data")
// await crawlAndSave(SEED_URLS)
// console.log("Step 1 completed successfully")
// console.log("Step 2: Enrich the latest raw data")
// await enrichLatestData()
// console.log("Step 2 completed successfully")스크립트 실행 :
pnpm run enrich-seed관리자 대시 보드를 통해 디렉토리의 컨텐츠 및 사용자를 관리하십시오. 여기에 액세스하십시오 :
관리자 대시 보드
디렉토리를 독특한 모양으로 제공하려면 사용자 정의 색상 테마를 만듭니다.
테마를 디자인하십시오
테마를 디자인하려면 사용자 정의 Shadcn 테마 페이지를 방문하십시오.
테마를 적용하십시오
테마가 있으면 관련 CSS를 복사하여 app/globals.css 파일에 붙여 넣어 5-67 행을 대체하십시오.
새 저장소를 만들고 프로젝트를 Github로 푸시하십시오.
Vercel으로 이동하여 Github 저장소 : 배포를 가져옵니다.
Vercel에서 환경 변수를 설정합니다
vercel의 프로젝트 설정으로 이동하여 .env.local 파일에서 컨텐츠를 복사하여 환경 변수를 설정하십시오. 다음 변수가 포함되어 있는지 확인하십시오.
NEXT_PUBLIC_SUPABASE_URL 당신의 supabase api urlNEXT_PUBLIC_SUPABASE_ANON_KEY supabase 익명 키SUPABASE_PROJECT_ID supabase 프로젝트 IDSUPABASE_ADMIN_ID 응용 프로그램의 관리자 ID다음은 환경 변수가 어떻게 보일지에 대한 예입니다.
NEXT_PUBLIC_SUPABASE_URL="https://abcd1234.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
SUPABASE_PROJECT_ID="abcd1234"
SUPABASE_ADMIN_ID="efgh5678"
프로젝트를 배포하십시오
환경 변수가 설정되면 프로젝트를 배포 할 수 있습니다. Vercel은 귀하를 위해 빌드 및 배포 프로세스를 처리합니다.
라이브 응용 프로그램에 액세스하십시오
배포 후 Vercel에서 제공 한 URL을 통해 라이브 응용 프로그램에 액세스 할 수 있습니다. 응용 프로그램은 이제 라이브로 사용되어야합니다.
컬트에 오신 것을 환영합니다! :)
이 readme에 요약 된 단계를 따라 디렉토리 앱을 배포하고 사용자 정의하십시오. 질문이 있거나 문제가 발생하면 트위터에서 지원을 받으려면 https://x.com/nolansym
건배! 당신이 무엇을 구축하는지보기 위해 스토킹했습니다!
다른 무료 상품
Cult UI는 Radix UI 및 Tailwind CSS로 제작 된 아름답게 설계된 반응 구성 요소 모음입니다. 이러한 구성 요소는 사용하기 쉽고 통합으로 최적화되어 시각적으로 매력적이고 기능적인 웹 애플리케이션을 만들 수 있습니다.
AI 템플릿은 AI 기반 응용 프로그램을 구축하도록 설계된 풀 스택 템플릿입니다. 다음은 JS, Tailwind CSS, Supabase 및 OpenAI를 활용하여 정교한 AI 솔루션을 개발하기위한 강력한 기반을 제공합니다.
위로 스크롤하십시오
