https://github.com/amirardalan/startup
A Next.js App Router starter project with TypeScript, Tailwind, NextAuth, Zustand, OG meta tags, and Dark Mode.
https://github.com/amirardalan/startup
app-router authjs clsx nextjs prettier tailwindcss typescript zustand
Last synced: 27 days ago
JSON representation
A Next.js App Router starter project with TypeScript, Tailwind, NextAuth, Zustand, OG meta tags, and Dark Mode.
- Host: GitHub
- URL: https://github.com/amirardalan/startup
- Owner: amirardalan
- License: mit
- Created: 2024-05-10T21:48:59.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-08-20T13:59:48.000Z (about 2 months ago)
- Last Synced: 2025-08-20T15:41:19.416Z (about 2 months ago)
- Topics: app-router, authjs, clsx, nextjs, prettier, tailwindcss, typescript, zustand
- Language: TypeScript
- Homepage: https://startup-next.vercel.app
- Size: 853 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
README
# Startup
This is a [Next.js](https://nextjs.org/) App Router project with various features and utilities to quickly bootstrap a web app.
### Features
- Autentication with [Auth.js](https://authjs.dev/getting-started/installation?framework=next-js)
- State management with [Zustand](https://github.com/pmndrs/zustand)
- Light, Dark, and System Theme toggle
- Prettier code formatting with [Tailwind plugin](https://tailwindcss.com/blog/automatic-class-sorting-with-prettier)
- [CLSX](https://github.com/lukeed/clsx) for improved logic within `className`
- Next.js [optimized fonts](https://nextjs.org/learn/dashboard-app/optimizing-fonts-images)
- Dynamic theme-based favicon
- Dynamic Metadata and Page Titles
- Route-based active navigation highlighting
- Dynamic footer copyright date
- Tooltip component
- [OG Image](https://vercel.com/docs/functions/og-image-generation) metadata
- Dynamically-generated [sitemap.xml](https://nextjs.org/docs/app/api-reference/file-conventions/metadata/sitemap)
## Getting Started
### Setup
```bash
npm install
```
Then, set up your [GitHub oAuth App](https://authjs.dev/getting-started/providers/github?framework=next-js) and add your GitHub Client ID and Secret in a `.env.local` file:
```
// .env.local
NEXT_PUBLIC_APP_URL="http://localhost:3000"
AUTH_GITHUB_ID=
AUTH_GITHUB_SECRET=
AUTH_TRUST_HOST=NEXT_PUBLIC_APP_URL
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=
```
And finally, generate a Next Auth secret which will automatically overwrite the placeholder in the `.env.local` file:
```bash
npx auth secret
```
### Run
```bash
npm run dev
```