T3 Portfolio

An open-source portfolio template with a custom admin dashboard bootstrapped with create-t3-app.

Warning

This project is in early development stage and is not recommended for production use. Various aspects of the application are subject to change.

Dashboard and landing page view

Tech stack

• Next.js - Framework
• NextAuth.js - Authentication
• Prisma - ORM
• Tailwind CSS - Styling
• shadcn/ui - UI components
• tRPC - Typesafe API
• AWS S3 - File uploading
• Zod - API and forms validation
• React Hook Form - Managing forms
• Framer motion - Animations
• PostgreSQL - Database

Getting started

1. Clone the repository and install all dependencies using pnpm
2. Copy the .env.example to the .env file and update the variables
3. Push the prisma schema to the database pnpm run prisma:push
4. Start the development server pnpm run dev
5. If necessary, run prisma studio to check the db data pnpm run prisma:studio

Environment variables

• Supabase or Docker PostgreSQL database URL. Supabase Documentation

DATABASE_URL=
DATABASE_DIRECT_URL=

• If you want to use PostgreSQL with Docker, you can configure the following environment variables. (optional) PostgreSQL documentation

POSTGRES_USER=
POSTGRES_PASSWORD=
POSTGRES_DB=

• NextAuth.js authentication variables. NextAuth Documentation

NEXTAUTH_SECRET=
NEXTAUTH_URL=

• Google provider keys required to login to the dashboard via Google account. Google 0Auth Documentation

GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=

• AWS variables required to support uploading images to S3. AWS S3 Documentation. More information on how to configure the AWS services are available here.

AWS_S3_BUCKET=
AWS_S3_REGION=
AWS_S3_ACCESS_KEY=
AWS_S3_SECRET_ACCESS_KEY=

• Allowed email addresses with access to the dashboard (separated by commas)

ALLOWED_EMAIL_ADDRESSES=

How do I deploy this?

Follow the deployment guides for Vercel, Netlify and Docker for more information.

License

This project is under the MIT license.