Mern Secure

Mern Secure is a secure web application built using the MERN stack (MongoDB, Express, React, Node.js). It features authentication and authorization using JWT tokens, Google OAuth integration, dynamic routing, and various other technologies for a seamless user experience.

Demo Video

Features

Frontend

• Pages:
  • Login Page
    
  • Signup Page
  • Forgot Password Page
  • Reset Password Page
  • Dashboard Page
  • Reset Password Work Flow
  • Google OAuth Work Flow
• Authentication & Authorization: JWT tokens are used to ensure secure access.
• Dynamic Routing: Routes are dynamically managed to ensure smooth navigation.
• Notifications: Success and error messages are displayed using React-Toastify.
• Styling: TailwindCSS is used for consistent and responsive styling.
• State Management: Context API is used for managing the application state.
• Form Handling: React-Hook-Form is utilized for easy form manipulation and error handling.
• Data Fetching: Fetch API with try & catch blocks are used for synchronous data fetching from backend APIs.

Backend

• Database: MongoDB is used for storing user and application data.
• Email Service: Nodemailer is used for sending emails for password resets and other notifications.
• Authentication & Authorization: JWT is used for securing endpoints and managing user sessions.
• Password Security: Bcrypt is used for hashing passwords to enhance security.
• Controllers: Dynamic controllers handle various data operations.
• Routing: Express Router is used for managing API routes.
• Google OAuth: Passport.js is used for Google login and signup integration.

Technologies Used

• Frontend: React, TailwindCSS, React-Toastify, React-Hook-Form, Context API
• Backend: Node.js, Express.js, MongoDB, Mongoose, Passport.js, Nodemailer, JWT, Bcrypt

Steps

1. Clone the repository:

   git clone https://github.com/surendiran04/mern-secure.git
   cd mern-secure