nextjs postgres nextauth tailwindcss template

Next.js 14 шаблон администратора администратора

Построен с маршрутизатором следующего.js App

Демо · клон и развертывание

Обзор

Это стартовый шаблон с использованием следующего стека:

• Framework - Next.js (маршрутизатор приложения)
• Язык - Типография
• Auth - auth.js
• База данных - Postgres
• Развертывание - Vercel
• Стиль - Tailwind CSS
• Компоненты - ui shadcn
• Аналитика - Vercel Analytics
• Форматирование - красивее

Этот шаблон использует новый маршрутизатор приложения next.js. Это включает в себя поддержку улучшенных макетов, солокацию компонентов, тестов и стилей, извлечение данных на уровне компонентов и многое другое.

Начиная

Во время развертывания Vercel предложит вам создать новую базу данных Postgres. Это добавит необходимые переменные среды в ваш проект.

Внутри панели панели Verce Postgres создайте таблицу, основанную на схеме, определенной в этом репозитории.

 CREATE TYPE status AS ENUM ('active', 'inactive', 'archived');

CREATE TABLE products (
  id SERIAL PRIMARY KEY,
  image_url TEXT NOT NULL,
  name TEXT NOT NULL,
  status status NOT NULL,
  price NUMERIC(10, 2) NOT NULL,
  stock INTEGER NOT NULL,
  available_at TIMESTAMP NOT NULL
);

Затем, endmommord app/api/seed.ts и нажмите http://localhost:3000/api/seed чтобы заселить базу данных продуктами.

Затем скопируйте файл .env.example на .env и обновите значения. Следуйте инструкциям в файле .env.example , чтобы настроить приложение GitHub OAuth.

npm i -g vercel
vercel link
vercel env pull

Наконец, запустите следующие команды, чтобы запустить сервер разработки:

 pnpm install
pnpm dev

Теперь вы должны иметь возможность получить доступ к приложению по адресу http: // localhost: 3000.