Skip to content

senior9/toyhaven-client-side

Repository files navigation

  • Project Live-link: https://toy-market-cb80a.web.app/

  • Project Name: TOYHAVEN This project is a web application that allows users to browse and purchase toys in various categories. It includes features such as user authentication, toy listings, user profile management, and more.

  • Features User Authentication: Users can register and log in to the website using their email and password. Google Sign-in is also available as an alternative login method. Toy Listings: The website displays a variety of toys categorized by different sub-categories. Each toy listing includes relevant information such as an image, name, price, rating, and a "View Details" button. User Profile: When logged in, users can access their profile, which displays their profile picture and username. The profile picture can be updated, and the username is visible on hover. Add A Toy: Logged-in users can add new toys to the website by providing details such as a picture URL, name, seller information, sub-category, price, rating, available quantity, and description. My Toys: Users can view and manage the toys they have added. The My Toys page allows users to update toy information, such as price and quantity, as well as delete toys from their listings.

  • Installation Clone the repository: git clone Install dependencies: npm install Set up environment variables for Firebase and MongoDB credentials. Run the application: npm start

  • Technologies Used React: JavaScript library for building user interfaces. React Router: Library for handling client-side routing in React applications. Firebase: Backend-as-a-Service (BaaS) platform for user authentication and real-time database management. MongoDB: NoSQL database for storing and retrieving toy data. CSS: Styling the components and creating an appealing user interface. -Development Process Designed the overall layout and structure of the web application. Implemented user authentication using Firebase to allow users to register, log in, and log out. Created components for toy listings, user profile, and adding/managing toys. Integrated Firebase and MongoDB to handle data storage and retrieval for toy listings and user information. Styled the components using CSS, ensuring an appealing color scheme, proper alignment, and visual consistency.

  • Future Enhancements Implement a search system on the "All Toys" page to allow users to search for toys by name. Add pagination to the "All Toys" page to display more than the default 20 results. Introduce email verification for user registration to enhance security. Expand the blogging functionality to allow users to create and share blog posts related to toys and learning. Enhance the overall user experience with animations and transitions. Feel free to customize the above information and add additional details specific to your project.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published