Mr. Secure 🔐

A Secure and User-Friendly Password Manager

Overview

Mr. Secure is a React-based password manager that allows users to securely store, edit, and manage their credentials for different websites. It features local storage, password validation, and one-click clipboard copying for ease of use.

---

Features 🚀

✅ Secure Password Storage – Store credentials safely in the browser’s local storage.
✅ Strong Password Validation – Ensures passwords meet security standards.
✅ Edit & Update Entries – Modify saved credentials easily.
✅ One-Click Copy – Quickly copy usernames and passwords to the clipboard.
✅ Delete Functionality – Remove credentials when no longer needed.
✅ Interactive UI – A sleek, modern, and responsive design with dark mode support.
✅ Animated Button Feedback – Button image dynamically changes on action.
✅ Toast Notifications – Get real-time feedback for actions (success, errors, and warnings).

---

Tech Stack 🛠

• Frontend: React.js, Tailwind CSS
• State Management: React Hooks (useState, useEffect)
• Storage: LocalStorage (No database required)
• UI Components: Font Awesome icons, Toastify notifications

---

Installation & Setup 🏗

1. Clone the Repository

git clone https://github.com/mohammadhashim135/MrSecure.git
cd MrSecure

2. Install Dependencies

npm install

3. Start the Application

npm start

---

Usage Guide 📝

🔹 Enter Website URL – Type the website name where the credentials belong.

🔹 Enter Username & Password – Provide the login details.

🔹 Click ‘Add Password’ – The credentials will be securely saved in local storage.

🔹 Copy Credentials – Click the copy icon to copy the username or password.

🔹 Edit or Delete – Modify or remove credentials as needed.

---

Project Structure 📂

MrSecure/
│── src/
│   │── components/
│   │   │── Manager.js  # Main Password Manager Component
│   │── assets/
│   │   │── Dashboard.gif  # Default button image
│   │   │── unlink.gif  # Animation for button click
│   │── App.js
│   │── index.js
│── public/
│── package.json
│── README.md

---

Screenshots 📸

---

Contributing 🤝

Contributions are welcome! If you’d like to improve Mr. Secure, feel free to fork the repo and submit a pull request.

Steps to Contribute:

Fork the repository

1. Create a new branch:

git checkout -b feature-branch

2. Make your changes and commit:

git commit -m "Added new feature"

3. Push to the branch:

git push origin feature-branch

Open a Pull Request

---

License 📜

This project is licensed under the MIT License.

💡 Developed with ❤️ by Mohammad Hashim

Mr. Secure 🔐

A Secure and User Friendly Password Manager

Overview

Mr. Secure is a React-based password manager that allows users to securely store, edit, and manage their credentials for different websites. It features local storage, password validation, and one-click clipboard copying for ease of use.

---

Features 🚀

✅ Secure Password Storage – Store credentials safely in the browser’s local storage.
✅ Strong Password Validation – Ensures passwords meet security standards.
✅ Edit & Update Entries – Modify saved credentials easily.
✅ One-Click Copy – Quickly copy usernames and passwords to the clipboard.
✅ Delete Functionality – Remove credentials when no longer needed.
✅ Interactive UI – A sleek, modern, and responsive design with dark mode support.
✅ Animated Button Feedback – Button image dynamically changes on action.
✅ Toast Notifications – Get real-time feedback for actions (success, errors, and warnings).

---

Tech Stack 🛠

• Frontend: React.js, Tailwind CSS
• State Management: React Hooks (useState, useEffect)
• Storage: LocalStorage (No database required)
• UI Components: Font Awesome icons, Toastify notifications

---

Installation & Setup 🏗

1. Clone the Repository

git clone https://github.com/mohammadhashim135/MrSecure.git
cd MrSecure

2. Install Dependencies

npm install

3. Start the Application

npm start

---

Usage Guide 📝

🔹 Enter Website URL – Type the website name where the credentials belong.

🔹 Enter Username & Password – Provide the login details.

🔹 Click ‘Add Password’ – The credentials will be securely saved in local storage.

🔹 Copy Credentials – Click the copy icon to copy the username or password.

🔹 Edit or Delete – Modify or remove credentials as needed.

---

Project Structure 📂

MrSecure/
│── src/
│   │── components/
│   │   │── Manager.js  # Main Password Manager Component
│   │── assets/
│   │   │── Dashboard.gif  # Default button image
│   │   │── unlink.gif  # Animation for button click
│   │── App.js
│   │── index.js
│── public/
│── package.json
│── README.md

---

Screenshots 📸

---

Contributing 🤝

Contributions are welcome! If you’d like to improve Mr. Secure, feel free to fork the repo and submit a pull request.

Steps to Contribute:

Fork the repository

1. Create a new branch:

git checkout -b feature-branch

2. Make your changes and commit:

git commit -m "Added new feature"

3. Push to the branch:

git push origin feature-branch

Open a Pull Request

---

License 📜

This project is licensed under the MIT License.

💡 Developed with ❤️ by Mohammad Hashim

=======

Mr. Secure 🔐

A Secure and User-Friendly Password Manager

Overview

Mr. Secure is a React-based password manager that allows users to securely store, edit, and manage their credentials for different websites. It features local storage, password validation, and one-click clipboard copying for ease of use.

---

Features 🚀

✅ Secure Password Storage – Store credentials safely in the browser’s local storage.
✅ Strong Password Validation – Ensures passwords meet security standards.
✅ Edit & Update Entries – Modify saved credentials easily.
✅ One-Click Copy – Quickly copy usernames and passwords to the clipboard.
✅ Delete Functionality – Remove credentials when no longer needed.
✅ Interactive UI – A sleek, modern, and responsive design with dark mode support.
✅ Animated Button Feedback – Button image dynamically changes on action.
✅ Toast Notifications – Get real-time feedback for actions (success, errors, and warnings).

---

Tech Stack 🛠

• Frontend: React.js, Tailwind CSS
• State Management: React Hooks (useState, useEffect)
• Storage: LocalStorage (No database required)
• UI Components: Font Awesome icons, Toastify notifications

---

Installation & Setup 🏗

1. Clone the Repository

git clone https://github.com/mohammadhashim135/MrSecure.git
cd MrSecure

2. Install Dependencies

npm install

3. Start the Application

npm start

---

Usage Guide 📝

🔹 Enter Website URL – Type the website name where the credentials belong.

🔹 Enter Username & Password – Provide the login details.

🔹 Click ‘Add Password’ – The credentials will be securely saved in local storage.

🔹 Copy Credentials – Click the copy icon to copy the username or password.

🔹 Edit or Delete – Modify or remove credentials as needed.

---

Project Structure 📂

MrSecure/
│── src/
│   │── components/
│   │   │── Manager.js  # Main Password Manager Component
│   │── assets/
│   │   │── Dashboard.gif  # Default button image
│   │   │── unlink.gif  # Animation for button click
│   │── App.js
│   │── index.js
│── public/
│── package.json
│── README.md

---

Screenshots 📸

---

Contributing 🤝

Contributions are welcome! If you’d like to improve Mr. Secure, feel free to fork the repo and submit a pull request.

Steps to Contribute:

Fork the repository

1. Create a new branch:

git checkout -b feature-branch

2. Make your changes and commit:

git commit -m "Added new feature"

3. Push to the branch:

git push origin feature-branch

Open a Pull Request

---

License 📜

This project is licensed under the MIT License.

💡 Developed with ❤️ by Mohammad Hashim