This is a modern Next.js project demonstrating a complete user authentication flow including MongoDB database, signup, login, profile management, password reset, and email verification.
- Getting Started
- Features
- Project Structure
- Pages Overview
- Email Integration
- Usage
- Screenshots
- Learn More
- Deployment
To add for the package from package.json
npm iTo run the development server:
npm run devOpen http://localhost:3000 in your browser to view the app.
- User Signup with email verification
- User Login and session management
- Profile page with user details
- Forgot password and reset password functionality
- Email notifications for verification and password reset using Mailtrap
- Secure token-based password reset links
src/app/- Contains all the Next.js app routes and pagessrc/app/api/users/- API routes for user authentication and managementsrc/models/- User model and database schema using MongoDB and Mongoosesrc/helpers/- Helper functions including mailer integrationsrc/middleware.ts- Middleware for route protection and validation
This project uses MongoDB as the database and Mongoose as the ODM (Object Data Modeling) library to define schemas and interact with MongoDB.
You can view and manage your MongoDB data using tools like MongoDB Compass.
- Sign In - User registration page
- Login - User login page
- Profile - User profile management page
- Forgot Password - Request password reset link
- Reset Password - Set a new password using a secure token
- Email Verification - Verify user email after signup
This project uses Mailtrap for capturing and testing emails during development. Due to domain and DNS permission constraints required for sending real emails, this project uses Mailtrap's sandbox environment for email testing.
It handles:
- Verification emails after signup
- Password reset emails with secure token links
- Signup a new user on the Sign In page.
- Check Mailtrap inbox for verification email and verify your account.
- Login with verified credentials.
- Access your profile page.
- Use Forgot Password page to request a password reset link.
- Use the Reset Password page accessed via the emailed token link to set a new password.
The easiest way to deploy this Next.js app is using Vercel. See Next.js deployment docs for details.
Feel free to contribute or raise issues on the GitHub repository.