Cloud Diary Application

created a Cloud Diary application using the MERN stack (MongoDB, Express, React, Node.js). It allows users to securely manage their diary entries, with full CRUD functionality for creating, reading, updating, and deleting notes stored in the cloud.

Key features include:

- User Authentication: I implemented secure authentication using bcryptjs for password hashing, express-validator for validation, and jsonwebtoken for managing user sessions.

- Notes Management: The app provides a user-friendly interface for managing notes, ensuring smooth CRUD operations.

- API Testing: I used Thunder Client for API testing to ensure that all endpoints work correctly.

- Animations: The frontend includes smooth animations with Framer Motion to enhance the user experience.

- Security: I used environment variables to keep the MongoDB Atlas connection string secure.

This project showcases my ability to build full-stack web applications with a focus on both functionality and user experience.

While building my Cloud Diary application, I faced several challenges, particularly around security, authentication, and frontend-backend integration. One of the key challenges was securing the MongoDB Atlas connection string without exposing sensitive information in the code. I tackled this by using environment variables to store the connection string, ensuring it stayed protected and wasn't publicly visible.

Another challenge was ensuring smooth authentication. Initially, I struggled with implementing user authentication securely. I addressed this by integrating bcryptjs for password hashing and express-validator for input validation, which made the login and signup process both secure and user-friendly. Managing JWT tokens also required attention to detail, particularly with ensuring that tokens were correctly stored and accessed during user sessions.

On the frontend, managing the interaction between the React app and the backend API was tricky, especially with fetching and updating notes. I had an issue where the API endpoint worked locally but not after deployment. After troubleshooting, I discovered that it was related to my environment variable setup and fixed it by correctly configuring the production environment settings.

Finally, incorporating animations using Framer Motion was a learning curve, but after some trial and error, I was able to create smooth transitions and effects, enhancing the overall user experience.

These challenges helped me refine my problem-solving skills and deepen my understanding of building robust, secure web applications.