next saas stripe starter

Next SaaS Stripe Starter

¡Comience a toda velocidad con SaaS Starter!

Introducción · Instalación · Tech Stack + Características · Autor · Créditos

Introducción

Empodera tu próximo proyecto con la pila de Next.js 14, Prisma, Neon, Auth.JS V5, Reven, Reaccion Correo electrónico, Shadcn/Ui y Stripe.
Todo integrado sin problemas con el iniciador SaaS para acelerar su desarrollo y su viaje SaaS.

Instalación

Clone y cree este repositorio localmente con el siguiente comando:

npx create-next-app my-saas-project --example " https://github.com/mickasmt/next-saas-stripe-starter "

O desplegar con Vercel:

Pasos

1. Instalar dependencias utilizando 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

Nota

Utilizo el paquete NPM-Check-Updates para actualizar este proyecto.

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

Hoja de ruta

• Actualizar Eslint a V9
• Agregar suscripciones de Rein para el éxito

Tech Stack + características

SaaS-Starter-Demo.mp4

Marcos

• Next.js - React Framework para crear aplicaciones performadoras con la mejor experiencia de desarrollador
• Auth.js: maneje la autenticación del usuario con facilidad con proveedores como Google, Twitter, Github, etc.
• Prisma-TypeScript-First ORM para Node.js
• React Correo electrónico: marco de correo electrónico versátil para un desarrollo de correo electrónico eficiente y flexible

Plataformas

• VERCEL: Vista previa fácilmente de vista e implementa cambios con Git
• Reenviar: un poderoso marco de correo electrónico para el desarrollo de correo electrónico optimizado
• Neon: postgres sin servidor con autoscalado, ramificación, almacenamiento sin fondo y nivel generoso de nivel libre.

Ui

• Tailwind CSS-MARCO CSS CSS de utilidad para el desarrollo rápido de la interfaz de usuario
• Shadcn/UI: componentes reutilizables construidos con Radix UI y CSS de viento de cola
• Framer Motion - Biblioteca de movimiento para reaccionar a los componentes animados con facilidad
• Lucide-iconos bellamente simples, perfectos para píxeles
• next/font : optimice las fuentes personalizadas y elimine las solicitudes de red externas para un rendimiento mejorado
• ImageResponse : genere imágenes de gráficos abiertos dinámicos en el borde

Ganchos y servicios públicos

• useIntersectionObserver : reaccione el gancho para observar cuándo ingresa un elemento o sale de la ventana
• useLocalStorage - Persist Datos en el almacenamiento local del navegador
• useScroll - React gancho para observar la posición de desplazamiento (ejemplo)
• nFormatter : números de formato con sufijos como 1.2k o 1.2M
• capitalize : capitalice la primera letra de una cadena
• truncate - truncar una cadena a una longitud especificada
• use-debounce : Desbloquear una actualización de llamadas de función / estado

Calidad del código

• TypeScript: verificador de tipo estático para TypeSafety de extremo a extremo
• Más bonito - formatero de código obstinado para un estilo de código consistente
• Eslint - Linter conectable para Next.js y TypeScript

Misceláneas

• VIRCELYTICS: rastrear visitantes únicos, visiones de página y más de una manera amigable con la privacidad

Autor

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

Créditos

Este proyecto se inspiró en la taxonomía de Shadcn, el precedente de Steven Tey y el próximo 13 AI SaaS de Antonio Erdeljac.

• Shadcn (@shadcn)
• Steven Tey (@Steventey)
• Antonio Erdeljac (@ytcodeandontonio)