next saas stripe starter

Следующий стартер полосы SaaS

Начните с полной скорости с SaaS Starter!

Введение · Установка · Технический стек + функции · Автор · Кредиты

Введение

Расширяйте свой следующий проект со стеком Next.js 14, Prisma, Neon, Auth.js V5, Resend, React Email, Shadcn/UI и Stripe.
Все плавно интегрировано с SaaS Starter, чтобы ускорить ваше развитие и путешествие SaaS.

Установка

Клонировать и создать это репо локально со следующей командой:

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

Или развернуть с Vercel:

Шаги

1. Установите зависимости, используя PNPM:

pnpm install

2. Копировать .env.example to .env.local и обновить переменные.

cp .env.example .env.local

3. Запустите сервер разработки:

pnpm run dev

Примечание

Я использую пакет NPM-проверки напрокат для обновления этого проекта.

Используйте эту команду для обновления вашего проекта: ncu -i --format group

Дорожная карта

• Обновить Eslint до V9
• Добавить подписки на успех для успеха

Технологический стек + функции

SaaS-Starter-Demo.mp4

Рамки

• Next.js - React Framework для создания приложений для выступления с лучшим опытом разработчика
• Auth.js - с легкостью обрабатывать аутентификацию пользователей с такими поставщиками, как Google, Twitter, GitHub и т. Д.
• Prisma-TypeScript-Pirst ORM для node.js
• React Email - универсальная структура электронной почты для эффективной и гибкой разработки электронной почты

Платформы

• Vercel - легко просмотреть и развернуть изменения с GIT
• Resend - мощная структура электронной почты для оптимизированной разработки электронной почты
• Neon - без серверов Postgres с автоматической масштабом, ветвлением, бездонными хранилищами и щедрым бесплатным уровнем.

UI

• Tailwind CSS-первая коммунальная структура CSS для быстрой разработки пользовательского интерфейса
• Shadcn/UI-повторные компоненты, построенные с использованием Radix UI и Tailwind CSS
• Движение Framer - библиотека движения для с легкостью реагировать на анимирующие компоненты
• Lucide-красиво простые, идеальные значки для пикселей
• next/font - оптимизируйте пользовательские шрифты и удалите внешние сетевые запросы для повышения производительности
• ImageResponse - генерируйте динамические изображения открытых графиков на краю

Крючки и коммунальные услуги

• useIntersectionObserver - React Hook, чтобы наблюдать, когда входит элемент или покидает просмотр
• useLocalStorage - Постоянные данные в локальном хранилище браузера
• useScroll - React Hook для наблюдения за положением прокрутки (пример)
• nFormatter - номера форматов с суффиксами, такими как 1.2k или 1.2M
• capitalize - используйте первую букву строки
• truncate - усекайте строку до указанной длины
• use-debounce

Качество кода

• TypeScript-Проверка статического типа для сквозных типов
• Кратчее - самоуверенный форматер кода для последовательного стиля кода
• Eslint - подключаемый Linter для lete.js и TypeScript

Разнообразный

• Vercel Analytics-отслеживайте уникальные посетители, просмотр страниц и многое другое в удобном для конфиденциальности

Автор

Создан @miickasmt в 2023 году, выпущенный по лицензии MIT.

Кредиты

Этот проект был вдохновлен таксономией Шадкна, прецедентом Стивена Тей и следующими 13 AI SaaS Антонио Эрделджака.

• Shadcn (@shadcn)
• Стивен Тей (@steventey)
• Антонио Эрдельджак (@ytcodeantonio)