DEV Community

Aayush Yadav
Aayush Yadav

Posted on

๐Ÿš€ Modern Auth System with Next.js, MongoDB, TypeScript & Mailtrap โ€“ Open Source & Deployed!

Hey devs! ๐Ÿ‘‹

Iโ€™m thrilled to share my latest project: a full-stack authentication system built with the latest web technologies. If youโ€™re looking for a robust, secure, and beautifully designed auth boilerplate for your next SaaS, side project, or just want to learn modern auth flowsโ€”this is for you!

๐Ÿ› ๏ธ Tech Stack
Frontend: Next.js (App Router, React 18)
Backend: Next.js API Routes
Database: MongoDB (with Mongoose)
Language: TypeScript
Email: Mailtrap (for safe email testing)
Styling: Tailwind CSS

โœจ Features
User Authentication (Sign Up, Login, Logout)
Email Verification (secure, token-based)
Forgot/Reset Password (with time-limited links)
Protected User Profile
Transactional Emails (Mailtrap integration)
TypeScript for type safety
Modern, Responsive UI (Tailwind CSS)
Security Best Practices (hashed passwords, token expiry, etc.)

๐Ÿšฆ Getting Started
Clone the repo:
git clone https://github.com/aayush130405/nextjs-auth.git
cd nextjs-auth

Install dependencies:
npm install

or

yarn install

Set up environment variables:
Create a .env.local file and add your MongoDB URI, Mailtrap credentials, etc. (see README for details).

Run locally:
npm run dev
Open http://localhost:3000 and try it out!

๐ŸŒ Live Demo
The project is deployed on Vercel for instant access:
๐Ÿ‘‰ Live Demo: nextjs-auth-self-two.vercel.app

๐Ÿ“š Well-Documented
Every feature, setup step, and code section is clearly explained in the GitHub README (https://github.com/aayush130405/nextjs-auth). Whether youโ€™re a beginner or a seasoned dev, youโ€™ll find it easy to follow and extend.

๐Ÿค Contribute & Feedback
Star โญ the repo if you find it useful!
Fork and submit PRs for improvements or new features.
Open issues for bugs or suggestions.

๐Ÿ’ก Why This Project?
Authentication is a core part of almost every app, but itโ€™s easy to get wrong. I wanted to create a reference project thatโ€™s:
Secure by default
Easy to understand and extend
Uses the latest Next.js and TypeScript features
Looks great out of the box

๐Ÿ”— Links
GitHub: https://github.com/aayush130405/nextjs-auth
Live Demo: nextjs-auth-self-two.vercel.app

Thanks for reading!

Would love your feedback, suggestions, and contributions.
Happy coding! ๐Ÿš€

nextjs #typescript #mongodb #mailtrap #webdev #opensource #authentication #vercel

Top comments (0)