NextJS Admin Template

A admin template built with Next.js 16, React 19, TypeScript, and Tailwind CSS 4.

Tech Stack

Technology	Version	Purpose
Next.js	16.2.4	App Router, SSR, standalone output
React	19.2.4	UI library (with React Compiler)
TypeScript	5.x	Type safety
Tailwind CSS	4.x	Utility-first styling
Lucide React	1.x	Icon set
pnpm	latest	Package manager

Prerequisites

• Node.js >= 22
• pnpm (enabled via corepack enable)

Getting Started

# install dependencies
pnpm install

# start the dev server
pnpm dev

Open http://localhost:3000 in your browser.

Scripts

Command	Description
pnpm dev	Start the development server
pnpm build	Create a production build (standalone output)
pnpm start	Run the production server
pnpm lint	Run ESLint across the project

Project Structure

src/
├── app/                        # Next.js App Router pages
│   ├── layout.tsx              # Root layout
│   ├── page.tsx                # Home page (/)
│   ├── login/                  # /login
│   ├── register/               # /register
│   ├── unauthorized/           # /unauthorized
│   ├── not-found.tsx           # 404 page
│   ├── admin/
│   │   ├── dashboard/          # /admin/dashboard
│   │   └── users/              # /admin/users
│   └── user/
│       ├── dashboard/          # /user/dashboard
│       └── profile/            # /user/profile
├── components/
│   ├── layouts/                # GuestLayout, UserLayout, AdminLayout
│   ├── pages/                  # Page-level components
│   ├── Providers.tsx           # Context providers wrapper
│   ├── ProtectedRoute.tsx      # Role-based route guard
│   └── ThemeToggle.tsx         # Dark / light mode toggle
├── contexts/                   # AuthContext, ThemeContext + type defs
└── hooks/                      # useAuth, useRole, useTheme

Docker

The project ships with a multi-stage Dockerfile that produces a minimal standalone image.

Build the image

bash scripts/docker-image-build.sh

Or manually:

docker build \
  --platform="linux/amd64" \
  --build-arg NODE_VERSION=22.14.0-slim \
  --file=docker/dockerfiles/app.Dockerfile \
  --tag="nextjs-admin-template:1.0.0" .

Run the container

docker run -p 3000:3000 nextjs-admin-template:1.0.0

Linting

See _docs/lint.md for the full ESLint configuration, ignored paths, and usage examples.

Quick commands:

# lint everything
pnpm lint

# lint a specific path
pnpm eslint src/components/

# auto-fix
pnpm eslint --fix

Contributing

1. Create a feature branch from dev.
2. Follow the PR guideline when opening a pull request — the repo includes a PR template that will auto-populate.
3. Make sure pnpm build and pnpm lint pass before requesting review.