https://github.com/kalix127/Nuxt3-LuciaAuth-Template
A Nuxt.js Authentication template (login, register, email validation, reset password and oauth) using Lucia-Auth, Prisma, PostgreSQL and Mailtrap.
https://github.com/kalix127/Nuxt3-LuciaAuth-Template
authentication lucia-auth mailtrap nuxtjs postgresql prisma
Last synced: 13 days ago
JSON representation
A Nuxt.js Authentication template (login, register, email validation, reset password and oauth) using Lucia-Auth, Prisma, PostgreSQL and Mailtrap.
- Host: GitHub
- URL: https://github.com/kalix127/Nuxt3-LuciaAuth-Template
- Owner: kalix127
- License: mit
- Created: 2024-08-19T01:12:12.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-02T13:59:27.000Z (9 months ago)
- Last Synced: 2025-09-20T08:48:28.460Z (24 days ago)
- Topics: authentication, lucia-auth, mailtrap, nuxtjs, postgresql, prisma
- Language: Vue
- Homepage: https://nuxt3-lucia-auth-template.vercel.app
- Size: 374 KB
- Stars: 7
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# Nuxt3 Lucia-Auth Template
A Nuxt.js Authentication template (login, register, email validation, reset password and oauth) using Lucia-Auth, Prisma, PostgreSQL and Mailtrap.
⚠️ **Note:** Please be aware that Lucia-Auth is scheduled to be deprecated in March 2025. For more details, refer to [Lucia-Auth Deprecation Discussion](https://github.com/lucia-auth/lucia/discussions/1714).
## Features
### Authentication
- **Register and Login with Credentials**: Users can create an account and log in using their email and password.
- **OAuth Integration (GitHub & Google)**: Users can authenticate using their GitHub or Google accounts.
- **Password Reset via Email**: Users can reset their password through an email link.
- **Email Verification**: Send verification emails to confirm user email addresses.
### Linked OAuth and Credentials-Based Accounts
- **Seamless Login**: If a user registers with their email (e.g., `example@example.com`) and later logs in with Google or GitHub using the same email address, they will be logged into their existing account. This ensures a unified user experience regardless of how they sign in.
- **Unified Accounts**: Whether the user signs up using credentials or OAuth, they will only have one account associated with their email, avoiding duplicate accounts and providing a seamless login experience.
### Pre-Built Pages
- **Tailwind CSS and DaisyUI Styling**: The template includes pre-built pages that are fully styled using Tailwind CSS and DaisyUI.
- **Form Validation (Client and Server-Side)**: All forms on the pre-built pages are validated both on the client side using Zod and VeeValidate.
- **Pages:**
- Homepage: An accessible page for anyone visiting the site.
- Protected Page: A page that requires users to be signed in to access.
- Login Page
- Register Page
- Reset Password Page (Send Request)
- Reset Password Page (Confirm)
- Email Verification Page
## Setup
Configure Environment Variables:
- Rename the `.env.example` file to `.env`:
- Populate the `.env` file with the following environment variables:
### Node.js
- `NODE_ENV=""`
- `ORIGIN=""`
### OAuth
- `GITHUB_CLIENT_ID=""`
- `GITHUB_CLIENT_SECRET=""`
- `GOOGLE_CLIENT_ID=""`
- `GOOGLE_CLIENT_SECRET=""`
### PostgreSQL URI
- `DATABASE_URL=""`
### Email
- `MAILTRAP_ENDPOINT=''`
- `MAILTRAP_SENDER=''`
- `MAILTRAP_PASSWORD=''`
- `MAILTRAP_TEMPLATE_UUID_RESET_PASSWORD=''`
- `MAILTRAP_TEMPLATE_UUID_VERIFY_EMAIL=''`
### Utils
- `COMPANY_NAME=''`
- `COMPANY_INFO_EMAIL=''`
- `COMPANY_SUPPORT_EMAIL=''`
- `COMPANY_CONTACT_EMAIL=''`
Make sure to install the dependencies:
```bash
npm install
```
## Setup Prisma
After installing the dependencies, you need to set up Prisma. First, run the migration command and specify a name for the migration. You can use `"init"` as the name:
```bash
npx prisma migrate dev --name init
```
Next, generate the Prisma client:
```bash
npx prisma generate
```
## Development Server
Start the development server on `http://localhost:3000`:
```bash
npm run dev
```
## Production
Build the application for production:
```bash
npm run build
```
Locally preview production build:
```bash
npm run preview
```