cult directory template
1.0.0
Una pila completa NextJS + SHADCN + Supabase Plantilla
| Característica | Versión gratuita | Versión pagada |
|---|---|---|
| Next.js v13 | ✅ | ✅ |
| /Directorio de aplicaciones | ✅ | ✅ |
| CSS de viento de cola | ✅ | ✅ |
| Componentes shadcn | ✅ | ✅ |
| VERCEL AI SDK | ✅ | ✅ |
| Integración de Supabase | ✅ | ✅ |
| Receptivo a los dispositivos móviles | ✅ | ✅ |
| Enviar RSC del producto | ✅ | ✅ |
| Modo oscuro y ligero | ✅ | ✅ |
| Autenticación de usuario | ✅ | ✅ |
| Filtros de productos | ✅ | ✅ |
| Temas de color personalizados | ✅ | ✅ |
| Actualizaciones gratuitas | ✅ | ✅ |
| Tablero de administración | ✅ | |
| Análisis de administración | ✅ | |
| Enriquecimiento de datos de IA a granel | ✅ | |
| Licencia | GPL-2.0 | Comercial |
| Fijación de precios | Gratis | $ 119 |
Únete al culto
Cuando te unes al culto, obtienes acceso de por vida a una variedad de otras plantillas premium.
| Plantilla | Descripción | Características | Enlace |
|---|---|---|---|
| Alijo de viaje | Aplicación de viaje fuera de línea con sincronización en tiempo real y soporte de PWA, diseñada para administrar y planificar objetivos de viaje. | Capacidades fuera de línea, sincronización en tiempo real, soporte de PWA, next.js, Tailwind CSS, Claude AI, RXDB Progressive Web App | Alijo de viaje |
| SEO de culto | Herramienta para rastrear sitios web, calificar SEO y proporcionar mejoras basadas en IA. | RSC Web Scraping, Web Vitals, salida de IA estructurada, Next.js, Tailwind CSS, Claude AI | SEO de culto |
| Manifiesto | Plantilla de pila completa para enviar aplicaciones de IA con integridades vectoriales y recuperación de trapo. | INCRECADOS VECTORES, RECUPERACIÓN DE RAG, SUPABASE, NEXT.JS, CSS CSS, AI ABIERTA | Manifiesto |
| Página de destino | Página de destino de suscripción de diseño. | Animación, navegación única, Next.js, Tailwind CSS | Página de destino |
| Backend | Varias plantillas de backend para diferentes necesidades. | Varias soluciones y fragmentos de backend para diferentes casos de uso. | Backend |
Cada una de estas plantillas está diseñada y de producción completa, como el directorio de culto. La pila de culto es Next.js, Shadcn, Tailwind CSS, Supabase y el Vercel Ai SDK.
Diseñado para ayudarlo a construir y lanzar nuevas empresas bien diseñadas rápidamente.
Mira el video de incorporación para girar rápidamente
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>
Cree un proyecto Supabase en el tablero de Supabase, o a través de la CLI:
npx supabase projects create -i " your-saas-app "Su ID de Org se puede encontrar en la URL después de seleccionar una organización.
Enlace su CLI al proyecto:
npx supabase init
npx supabase linkSeleccione el proyecto que acaba de crear.
.env.local para next.js Tienda Supabase URL y Public Anon Key en .env.local para next.js:
NEXT_PUBLIC_SUPABASE_URL= < api-url >
NEXT_PUBLIC_SUPABASE_ANON_KEY= < anon-key >Puede obtener la URL API del proyecto y la clave anónima de la página API Configuración.
CONFIGURACIÓN DEL ESQUEMA DB:
Esto ejecutará todas las migraciones ubicadas en el directorio de
supabase/migrations
supabase db push.env estén configuradas correctamente 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.. " En un terminal separado, ejecute los siguientes comandos:
pnpm ipnpm run devAbra http: // localhost: 3000 en su navegador.
La limitación de tasa SMTP predeterminada para Supabase es muy baja ahora.
Correo electrónico de proveedores - Página de configuración de API.
Para agregar nuevos productos a su directorio, simplemente visite la página de envío:
Enviar productos
Ahora tiene una base de datos completamente sembrada con todos los datos que necesita para comenzar a construir su propio directorio de culto.
Versión pagada solamente
Únete al culto
La limitación de tasa SMTP predeterminada para Supabase es muy baja ahora.
Correo electrónico de proveedores - Página de configuración de API.
Si necesita confirmación por correo electrónico, siga estas guías
Acceso
Recupere de la página Configuración de la API de la tabla de usuarios de autores.
En .env.local Copia la variable SUPABASE_ADMIN_ID y péguelo en el editor SQL.
Vaya al editor SQL en la página Configuración de la API de Supabase.
UPDATE auth . users
SET raw_app_meta_data = jsonb_set(
coalesce(raw_app_meta_data, ' {} ' ),
' {claims_admin} ' ,
' true ' ::jsonb
)
WHERE id = ' USER_UUID ' ; Para asignar derechos de administración a un usuario, ejecute el siguiente script SQL. Reemplace 'USER_UUID' con la misma identificación de usuario que copió de la tabla de usuarios de autores.
El guión de semillas es bastante complejo. Hay Docios de descripción general 0.
supabase/seed/src/README.mdy Docs para cada etapa:
supabase/seed/src/stage-1-crawl/readme.mdsupabase/seed/src/stage-2-enrich/readme.mdsupabase/seed/src/stage-3-seed/readme.mdHe tratado de hacerlo lo más barato posible. Dependiendo de su nivel de soporte de API, puede aumentar el rendimiento de los scripts jugando con los valores de concurrencia y tiempo de espera.
Necesita el ANTHROPIC_API_KEY o un ANTHROPIC_API_KEY en su archivo .env.local para ejecutar supabase/seed/src/stage-2-enrich .
Si tiene una clave API, cópielo a su archivo .env.local .
Opcionalmente, edite la variable SEED_URLS en supabase/seed/src/main.ts para incluir las URL que desea raspar y enriquecer.
Ejecute el guión:
pnpm run enrich-seed Si no tiene una clave API, he incluido un conjunto de datos previamente enriquecido de una ejecución anterior. Puede ver esto en supabase/seed/src/stage-2-enrich/__data__/enriched-20240611T210738.json .
Para usar este conjunto de datos en lugar de enriquecer usando sus claves:
Abra el archivo en supabase/seed/src/main.ts .
Comentar las líneas 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")Ejecute el guión:
pnpm run enrich-seedAdministre el contenido y los usuarios de su directorio a través del tablero de administración. Acceda a él aquí:
Tablero de administración
Para darle a su directorio un aspecto único, cree un tema de color personalizado:
Diseña tu tema
Visite la página del tema SHADCN personalizado para diseñar su tema.
Aplica tu tema
Una vez que tenga su tema, copie el CSS relevante y péguelo en su archivo app/globals.css , reemplazando las líneas 5-67.
Cree un nuevo repositorio y envíe el proyecto a GitHub.
Vaya a Vercel e importe el repositorio de GitHub: implement.
Configurar variables de entorno en Vercel
Vaya a la configuración de su proyecto en VERCEL y configure las variables de entorno copiando el contenido de su archivo .env.local . Asegúrese de que se incluyan las siguientes variables:
NEXT_PUBLIC_SUPABASE_URL - su URL de la API de SupabaseNEXT_PUBLIC_SUPABASE_ANON_KEY - Su clave anónima de SupabaseSUPABASE_PROJECT_ID - ID de su proyecto SupabaseSUPABASE_ADMIN_ID - ID de usuario de administración para su aplicaciónAquí hay un ejemplo de cómo podrían verse sus variables de entorno:
NEXT_PUBLIC_SUPABASE_URL="https://abcd1234.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
SUPABASE_PROJECT_ID="abcd1234"
SUPABASE_ADMIN_ID="efgh5678"
Implementar el proyecto
Una vez que se establecen sus variables de entorno, puede implementar su proyecto. Vercel manejará el proceso de compilación e implementación para usted.
Acceda a su aplicación en vivo
Después de la implementación, puede acceder a su aplicación en vivo a través de la URL proporcionada por VERCEL. Su aplicación ahora debe estar en vivo y lista para usar.
¡Bienvenido al culto! :)
Siga los pasos descritos en este ReadMe para implementar y personalizar su aplicación de directorio. Si tiene alguna pregunta o se encuentra con problemas, no dude en comunicarse con el apoyo en Twitter: https://x.com/nolansym
¡Salud! ¡Avivó para ver lo que construyes!
Otros productos gratuitos
Cult UI es una colección de componentes React bellamente diseñados construidos con UI Radix y CSS de viento de cola. Estos componentes están optimizados para la facilidad de uso e integración, lo que hace que sea simple crear aplicaciones web funcionales y visualmente atractivas.
La plantilla de AI es una plantilla de pila completa diseñada para construir aplicaciones con IA. Aprovecha los próximos.js, el viento de cola, Supabase y OpenAI para proporcionar una base robusta para desarrollar soluciones sofisticadas de IA.
Desplácese hasta arriba
