I recently started learning Next.js and I wanted to improve my Next.js skills, so I decided to make a simple Login and Signup Website with Next.js and MongoDB.
The website has 4 pages and 3 API routes:
-
/: where the user can see if they have logged in or not, and view all the other pages they can access -
/login: a page where the user can login -
/signup: the page where the user can signup for an account -
/profile: where the user can check their account creation date -
/api/signup: the API route where a user's account is created -
/api/login: the API route where the password entered is checked -
/api/logout: the API route where the username cookie is deleted
I have used cookies to check if the user has logged in.
The cookies are set and deleted in the /api routes but read using getServerSideProps.
The full source code can be viewed in this GitHub repo:
Login and Signup with Next.js
This template uses Next.js and MongoDB to create a simple login and signup website.
To use this template, simply fork the repo, and added your MongoDB URI to the .env file with the key MONGODB_URI.
To view the template in action, visit https://login-signup-nextjs.vercel.app
Can you check out the code and give me ways I can improve?
Top comments (10)
Hey, this is really cool! It might be nice to add email verification so that people can't just spam accounts. Otherwise nice work :)
that seems like a great idea, ill try it out! thanks :)
Good Post, Password Strength Checker Validation feature would have been good too
that's true
It's cool, but I'd recommend using next connect for API routes.
oh ill try that out
that shows up sometimes…
I’ll try to find out how to fix it
In case you're still wondering what it is. It's an issue from the user's end and it cannot be fixed unless with a stronger password.
oh okay thats fine then, thanks!