Skip to content

Commit dce131a

Browse files
cjellickcjellick
committed
Initial commit
Created from https://vercel.com/new
0 parents  commit dce131a

27 files changed

+5419
-0
lines changed

‎.env.local.example

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# https://vercel.com/docs/storage/vercel-postgres
2+
POSTGRES_URL=
3+
POSTGRES_USER=
4+
POSTGRES_PASSWORD=
5+
POSTGRES_HOST=
6+
POSTGRES_DATABASE=
7+
8+
NEXTAUTH_URL=http://localhost:3000
9+
AUTH_SECRET= # Linux: `openssl rand -hex 32` or go to https://generate-secret.now.sh/32
10+
11+
# https://next-auth.js.org/providers/github
12+
OAUTH_CLIENT_KEY=
13+
OAUTH_CLIENT_SECRET=

‎.eslintrc.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎.gitignore

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
.pnpm-debug.log*
27+
28+
# local env files
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# typescript
35+
*.tsbuildinfo
36+
next-env.d.ts

‎.vscode/settings.json

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"typescript.tsdk": "node_modules/typescript/lib",
3+
"typescript.enablePromptUseWorkspaceTsdk": true
4+
}

‎LICENSE.md

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2023 Vercel, Inc.
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
<picture>
2+
<source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/9113740/201498864-2a900c64-d88f-4ed4-b5cf-770bcb57e1f5.png">
3+
<source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/9113740/201498152-b171abb8-9225-487a-821c-6ff49ee48579.png">
4+
<img alt="Shows all of the tools in the stack for this template, also listed in the README file." src="https://user-images.githubusercontent.com/9113740/201498152-b171abb8-9225-487a-821c-6ff49ee48579.png">
5+
</picture>
6+
7+
<div align="center"><strong>Next.js 13 Admin Dashboard Template</strong></div>
8+
<div align="center">Built with the Next.js App Router</div>
9+
<br />
10+
<div align="center">
11+
<a href="http://admin-dash-template.vercel.sh/">Demo</a>
12+
<span> · </span>
13+
<a href="https://vercel.com/templates/next.js/admin-dashboard-tailwind-planetscale-react-nextjs">Clone & Deploy</a>
14+
<span>
15+
</div>
16+
17+
## Overview
18+
19+
This is a starter template using the following stack:
20+
21+
- Framework - [Next.js 13](https://nextjs.org/13)
22+
- Language - [TypeScript](https://www.typescriptlang.org)
23+
- Auth - [NextAuth.js](https://next-auth.js.org)
24+
- Database - [Vercel Postgres](https://vercel.com/postgres)
25+
- Deployment - [Vercel](https://vercel.com/docs/concepts/next.js/overview)
26+
- Styling - [Tailwind CSS](https://tailwindcss.com)
27+
- Components - [Tremor](https://www.tremor.so)
28+
- Analytics - [Vercel Analytics](https://vercel.com/analytics)
29+
- Linting - [ESLint](https://eslint.org)
30+
- Formatting - [Prettier](https://prettier.io)
31+
32+
This template uses the new Next.js App Router. This includes support for enhanced layouts, colocation of components, tests, and styles, component-level data fetching, and more.
33+
34+
## Getting Started
35+
36+
During the deployment, Vercel will prompt you to create a new Postgres database. This will add the necessary environment variables to your project.
37+
38+
Inside the Vercel Postgres dashboard, create a table based on the schema defined in this repository.
39+
40+
```
41+
CREATE TABLE users (
42+
id SERIAL PRIMARY KEY,
43+
email VARCHAR(255) NOT NULL,
44+
name VARCHAR(255),
45+
username VARCHAR(255)
46+
);
47+
```
48+
49+
Insert a row for testing:
50+
51+
```
52+
INSERT INTO users (id, email, name, username) VALUES (1, '[email protected]', 'Me', 'username');
53+
```
54+
55+
Finally, run the following commands to start the development server:
56+
57+
```
58+
pnpm install
59+
pnpm dev
60+
```
61+
62+
You should now be able to access the application at http://localhost:3000.

‎app/api/auth/[...nextauth]/route.ts

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
export { GET, POST } from '../../../auth';
2+
export const runtime = 'edge';

‎app/auth.ts

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import NextAuth from 'next-auth';
2+
import GitHub from 'next-auth/providers/github';
3+
4+
export const {
5+
handlers: { GET, POST },
6+
auth
7+
} = NextAuth({
8+
providers: [
9+
GitHub({
10+
clientId: process.env.OAUTH_CLIENT_KEY as string,
11+
clientSecret: process.env.OAUTH_CLIENT_SECRET as string
12+
})
13+
],
14+
pages: {
15+
signIn: '/sign-in'
16+
}
17+
});

‎app/dismiss-button.tsx

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
'use client';
2+
3+
import Cookies from 'js-cookie';
4+
import { useRouter } from 'next/navigation';
5+
6+
export default function DismissButton() {
7+
const router = useRouter();
8+
9+
return (
10+
<button
11+
className="contents underline text-blue-600"
12+
onClick={() => {
13+
Cookies.set('template-banner-hidden', 'true');
14+
router.refresh();
15+
}}
16+
>
17+
Dismiss →
18+
</button>
19+
);
20+
}

‎app/favicon.ico

25.3 KB
Binary file not shown.

‎app/globals.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;

‎app/layout.tsx

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import './globals.css';
2+
3+
import { Analytics } from '@vercel/analytics/react';
4+
import Nav from './nav';
5+
import Toast from './toast';
6+
import { Suspense } from 'react';
7+
8+
export const metadata = {
9+
title: 'Next.js App Router + NextAuth + Tailwind CSS',
10+
description:
11+
'A user admin dashboard configured with Next.js, Postgres, NextAuth, Tailwind CSS, TypeScript, ESLint, and Prettier.'
12+
};
13+
14+
export default function RootLayout({
15+
children
16+
}: {
17+
children: React.ReactNode;
18+
}) {
19+
return (
20+
<html lang="en" className="h-full bg-gray-50">
21+
<body className="h-full">
22+
<Suspense>
23+
<Nav />
24+
</Suspense>
25+
{children}
26+
<Analytics />
27+
<Toast />
28+
</body>
29+
</html>
30+
);
31+
}

‎app/loading.tsx

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { Title, Text } from '@tremor/react';
2+
import Search from './search';
3+
4+
export default function Loading() {
5+
return (
6+
<main className="p-4 md:p-10 mx-auto max-w-7xl">
7+
<Title>Users</Title>
8+
<Text>A list of users retrieved from a Postgres database.</Text>
9+
<Search disabled />
10+
<div className="tremor-base tr-relative tr-w-full tr-mx-auto tr-text-left tr-ring-1 tr-mt-6 tr-max-w-none tr-bg-white tr-shadow tr-border-blue-400 tr-ring-gray-200 tr-pl-6 tr-pr-6 tr-pt-6 tr-pb-6 tr-rounded-lg h-[360px]" />
11+
</main>
12+
);
13+
}

‎app/nav.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import Navbar from './navbar';
2+
import { auth } from './auth';
3+
4+
export default async function Nav() {
5+
const session = await auth();
6+
return <Navbar user={session?.user} />;
7+
}

0 commit comments

Comments
 (0)