next auth roles template

Siguiente plantilla de roles de autenticación

¡Empiece a toda velocidad con esta plantilla Next.js!

Instalación · Tech Stack + Características · Autor

Instalación

Clona y crea este repositorio localmente con el siguiente comando:

npx create-next-app my-saas-project --example " https://github.com/mickasmt/next-auth-roles-template "

O implemente con Vercel:

Pasos

1. Instale dependencias usando pnpm:

pnpm install

2. Copie .env.example a .env.local y actualice las variables.

cp .env.example .env.local

3. Inicie el servidor de desarrollo:

pnpm run dev

4. Quita las partes que no quieras

Puedes usar el comando pnpm run remove-content en tu terminal para eliminar partes específicas de tu proyecto. Este comando admite los siguientes parámetros:

• --blog : Elimina la sección del blog de tu proyecto.
• --docs : Elimina la sección de documentación de su proyecto.

Recomendaciones

• Eliminar ambas secciones : se recomienda utilizar pnpm run remove-content sin especificar parámetros ( --blog o --docs ). Esto garantiza que todos los documentos asociados se eliminen correctamente, ya que es posible que algunos documentos no se eliminen/actualicen si elimina "blog" después de "docs" o viceversa.

Ejemplos

1. Para eliminar las secciones del blog y de documentación:

pnpm run remove-content

2. Para eliminar solo la sección del blog:

pnpm run remove-content --blog

3. Para eliminar solo la sección de documentación:

pnpm run remove-content --docs

Nota

Utilizo el paquete npm-check-updates para actualizar este proyecto.

Utilice este comando para actualizar su proyecto: ncu -i --format group

Pila de tecnología + características

Marcos

• Next.js: marco React para crear aplicaciones de alto rendimiento con la mejor experiencia de desarrollador
• Auth.js: maneje la autenticación de usuarios con facilidad con proveedores como Google, Twitter, GitHub, etc.
• Prisma: primer ORM mecanografiado para Node.js
• React Email: marco de correo electrónico versátil para un desarrollo de correo electrónico eficiente y flexible

Plataformas

• Vercel: obtenga una vista previa e implemente cambios fácilmente con git
• Reenviar: un potente marco de correo electrónico para un desarrollo de correo electrónico optimizado
• Neon: Postgres sin servidor con escalado automático, ramificación, almacenamiento sin fondo y un generoso nivel gratuito.

interfaz de usuario

• Tailwind CSS: marco CSS de utilidad para un desarrollo rápido de la interfaz de usuario
• Shadcn/ui: componentes reutilizables creados con Radix UI y Tailwind CSS
• Lucide: iconos maravillosamente simples y con píxeles perfectos
• next/font : optimice fuentes personalizadas y elimine solicitudes de red externa para mejorar el rendimiento
• ImageResponse : genere imágenes dinámicas de Open Graph en el borde

Ganchos y utilidades

• useIntersectionObserver : gancho de reacción para observar cuando un elemento entra o sale de la ventana gráfica
• useLocalStorage : datos persistentes en el almacenamiento local del navegador
• useScroll : gancho de reacción para observar la posición de desplazamiento (ejemplo)
• nFormatter : formatee números con sufijos como 1.2k o 1.2M
• capitalize : poner en mayúscula la primera letra de una cadena
• truncate : trunca una cadena a una longitud especificada
• use-debounce – Antirrebote de una llamada de función/actualización de estado

Calidad del código

• TypeScript: verificador de tipos estáticos para seguridad de tipos de un extremo a otro
• Más bonito: formateador de código con opiniones para un estilo de código consistente
• ESLint: linter conectable para Next.js y TypeScript

Misceláneas

• Vercel Analytics: realice un seguimiento de visitantes únicos, páginas vistas y más de forma respetuosa con la privacidad

Autor

Este proyecto se basa en Next SaaS Stripe Starter.

Creado por @miickasmt en 2023, publicado bajo licencia MIT.

Créditos

Gracias a Hosna Qasmei por parte del código de la barra lateral del tablero.