next auth roles template

Следующий шаблон ролей аутентификации

Начните на полной скорости с этим шаблоном Next.js!

Установка · Технический стек + возможности · Автор

Установка

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

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

Или выполните развертывание с помощью Vercel:

Шаги

1. Установите зависимости с помощью pnpm:

pnpm install

2. Скопируйте .env.example в .env.local и обновите переменные.

cp .env.example .env.local

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

pnpm run dev

4. Удалите ненужные части

Вы можете использовать команду pnpm run remove-content в своем терминале, чтобы удалить определенные части вашего проекта. Эта команда поддерживает следующие параметры:

• --blog : удаляет раздел блога из вашего проекта.
• --docs : удаляет раздел документации из вашего проекта.

Рекомендации

• Удалить оба раздела : рекомендуется использовать pnpm run remove-content без указания параметров ( --blog или --docs ). Это гарантирует правильное удаление всех связанных документов, поскольку некоторые документы не могут быть удалены/обновлены, если вы удалите слово «блог» после слова «документы» или наоборот.

Примеры

1. Чтобы удалить разделы блога и документации:

pnpm run remove-content

2. Чтобы удалить только раздел блога:

pnpm run remove-content --blog

3. Чтобы удалить только раздел документации:

pnpm run remove-content --docs

Примечание

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

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

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

Рамки

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

Платформы

• Vercel – простой просмотр и развертывание изменений с помощью git
• Повторная отправка — мощная платформа электронной почты для оптимизации разработки электронной почты.
• Neon — бессерверный Postgres с автомасштабированием, ветвлением, бездонным хранилищем и щедрым уровнем бесплатного пользования.

пользовательский интерфейс

• Tailwind CSS — многофункциональная CSS-инфраструктура для быстрой разработки пользовательского интерфейса.
• Shadcn/ui — повторно используемые компоненты, созданные с использованием пользовательского интерфейса Radix и CSS Tailwind.
• Lucide – красивые простые иконки с идеальным разрешением до пикселя.
• next/font — оптимизируйте пользовательские шрифты и удалите внешние сетевые запросы для повышения производительности.
• ImageResponse – создание динамических изображений Open Graph на границе

Хуки и утилиты

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

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

• TypeScript — средство проверки статического типа для сквозной безопасности типов.
• Prettier – авторитетный форматировщик кода для единообразного стиля кода.
• ESLint — подключаемый линтер для Next.js и TypeScript.

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

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

Автор

Этот проект основан на Next SaaS Stripe Starter.

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

Кредиты

Спасибо Хосне Касмеи за часть кода боковой панели панели инструментов.