尧图建网站 尧图建网站 YAOTU WEB BUILD 免费咨询
ARTICLE DETAIL

资讯详情

深耕网站建设与建站编程的一线实战洞察。

革命性开源目录网站模板Cult Directory Template:Next.js+Supabase全栈搭建一次搞定

革命性开源目录网站模板Cult Directory Template:Next.js+Supabase全栈搭建一次搞定 革命性开源目录网站模板Cult Directory TemplateNext.jsSupabase全栈搭建一次搞定【免费下载链接】cult-directory-templateA full stack Next.js, Shadcn, and Supabase directory template. Build your startup directory effortlessly with features like user authentication, product filters, and customizable themes. Advanced admin perks and AI magic.项目地址: https://gitcode.com/gh_mirrors/cu/cult-directory-templateCult Directory Template 是一款基于 Next.js、Shadcn UI 与 Supabase 构建的全栈开源目录网站模板专为想快速上线产品导航站、工具收录站、资源聚合平台的开发者打造。它内置用户认证、产品筛选、搜索、深浅色主题切换等功能后台管理、数据看板与 AI 批量内容增强更是它的杀手锏让你无需从零造轮子一次搞定目录网站的全流程搭建。什么是 Cult Directory Template开箱即用的目录网站模板简单来说它是一个目录网站全家桶。项目描述写道A full stack Next.js, Shadcn, and Supabase directory template即采用当前最流行的三大技术栈组合Next.jsApp Router RSC负责前台页面渲染与服务端数据获取SEO 友好Shadcn UI Tailwind CSS提供精美的组件库与响应式样式Supabase搞定数据库、认证与文件存储零后端代码你只需克隆仓库、配置环境变量、运行数据库迁移就能拥有一个功能完整的目录站点从零到上线通常只需要半天时间。核心功能一览目录网站模板该有的它全都有功能免费版付费版Next.js App Router✅✅Tailwind CSS Shadcn 组件✅✅Supabase 集成✅✅用户认证系统✅✅产品提交表单✅✅产品搜索与分类筛选✅✅深浅色模式✅✅自定义主题色✅✅后台管理看板❌✅数据指标分析❌✅AI 批量内容增强❌✅前台体验搜索、筛选与卡片展示首页由左侧分类导航栏与右侧资源卡片流组成分类、标签、标签三套维度可组合筛选配合实时搜索见 components/directory-search.tsx用户能快速找到目标产品。产品卡片带浏览量计数点击会触发乐观更新见 components/directory-product-card.tsx交互丝滑流畅。快速搭建步骤4 步跑通本地开发想要体验这款目录网站模板跟着下面几步走即可第一步克隆仓库并安装依赖git clone https://gitcode.com/gh_mirrors/cu/cult-directory-template cd cult-directory-template pnpm i第二步配置 Supabase 环境安装 Supabase CLI 并创建项目然后初始化并关联npx supabase init npx supabase link接着在.env.local中填入项目 API URL 与匿名公钥cp .env.local.example .env.local NEXT_PUBLIC_SUPABASE_URLapi-url NEXT_PUBLIC_SUPABASE_ANON_KEYanon-key第三步一键初始化数据库结构项目在 supabase/migrations/ 目录下预置了完整的迁移脚本涵盖用户表、产品表、筛选函数、存储桶与浏览量统计等supabase db push第四步启动开发服务器pnpm run dev浏览器访问 http://localhost:3000 即可看到你的目录网站雏形提交产品与内容管理人人都能投稿模板内置了完整的提交流程访客无需懂代码即可录入产品。提交页面见 app/submit/form.tsx使用 React Hook Form Zod 做实时校验支持分类选择、Logo 上传并调用 Server Action 写入数据库见 app/submit/action.ts数据经过 app/submit/schema.ts 严格验证安全可靠。后台管理产品审核、标签管理与数据看板付费版附带专业级管理后台访问/admin即可产品管理对提交的产品进行审核、上架与下架支持按状态筛选All / Approved / Pending / New标签管理灵活维护分类、标签与标签体系让内容组织井井有条数据看板通过图表直观查看标签与标签的活动趋势为运营决策提供依据AI 批量内容增强让目录自动生长这是模板最具想象力的功能。通过 supabase/seed/src/main.ts 的三阶段脚本爬取 → AI 增强 → 写入可批量抓取指定 URL、用 Anthropic 或 OpenAI 接口生成描述、标签与分类自动填充整个目录数据库。没有 API Key 也没关系项目内置了一份预增强数据集开箱即用。主题定制3 分钟换肤模板的主题定制非常简单只需访问 Shadcn 主题设计器生成配色将生成的 CSS 粘贴到 app/globals.css替换第 5-67 行你的目录网站就会拥有独一无二的视觉风格深浅色模式自动适配。部署上线Vercel 一键搞定本地跑通后部署同样轻松将代码推送到你的 Git 仓库在 Vercel 导入该仓库配置环境变量NEXT_PUBLIC_SUPABASE_URL、NEXT_PUBLIC_SUPABASE_ANON_KEY、SUPABASE_PROJECT_ID、SUPABASE_ADMIN_ID等点击 Deploy等待构建完成即可访问线上站点总结这款目录网站模板适合谁如果你正准备做以下类型的项目Cult Directory Template 绝对值得一试独立开发者快速验证导航站/收录站想法抢占 SEO 红利创业团队以最低成本上线 MVP后续再迭代付费功能前端工程师学习 Next.js Supabase 全栈架构的绝佳参考它最大的价值在于目录网站的完整业务逻辑认证、投稿、筛选、后台、AI 增强已经全部封装好你只需专注于内容与运营。免费版采用 GPL-2.0 协议可自由商用付费版则解锁后台看板与 AI 增强等进阶能力。想体验一次搭建、持续生长的目录网站开发体验现在就克隆仓库动手试试吧【免费下载链接】cult-directory-templateA full stack Next.js, Shadcn, and Supabase directory template. Build your startup directory effortlessly with features like user authentication, product filters, and customizable themes. Advanced admin perks and AI magic.项目地址: https://gitcode.com/gh_mirrors/cu/cult-directory-template创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表