This is a responsive nextJs-auth-system CRUD notes web app. Build an email and password authentication system with NextAuth.js and MongoDB.
This web app using dependencies are:
"axios": "^1.4.0",
"bootstrap": "^5.3.1",
"bootstrap-icons": "^1.10.5",
"mongoose": "^7.4.2",
"bcryptjs": "^2.4.3",
"next-auth": "^4.22.4",
"nodemailer": "^6.9.4",
Application functionality are:
- Create new note
- Update note
- Delete note
- Search note
- LogIn
- SignUp
- Forgot password
- Change password
- Save hash password
- Send Email OTP
- OTP verification time set 80 seconds
- Google and GitHub SignIn
- User wise data show
- Cookies, Session Storage, Local Storage set the NextAuth
- Backend server using NextJs API Routes
- Loading indicator
- responsive large, laptop, tablet, mobile screen.
Highly recommended use chrome browser.
- Save all this .env file:
# add your google account_id and google_secret
GOOGLE_ID=
GOOGLE_SECRET=
# add your github account_id and github_secret
GITHUB_ID=
GITHUB_SECRET=
# add your gmail id or account App passwords generate
EMAIL=
EMAIL_PASS=
# mongodb link
MONGO_LOCAL=mongodb://127.0.0.1:27017/nextjsAuthNoteApp
# local url
NEXTAUTH_URL=http://localhost:3000
#Generate Random Passwords via Command Line type cmd= openssl rand -base64 32
AUTH_SECRET=
- First download the code and run:
npm install
-
Start mongodb server.
-
Run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
Open http://localhost:3000 with your browser to see the result.