Skip to content

sabbirsohag-1509/assignment-10-client-site

Repository files navigation

  • 1.Website Name: HomeNest.

The theme of this project is: This is a real estate listing platform where property owners can post their available rentals or sale listings, and users can browse, search, and filter properties by location, price, or type...

  1. Purpose: The main purpose of this project is to-
  • -CRUD functionality is the main purpose. We can store our Data in backend MongoDB. We can POST, GET, UPDATE and DELETE our data from client site.
  • -Authentication our web application.
  • -Firebase Admin SDK. Using it we can secure our backend data information.
  • -Dynamically we can change route.
  • -We can show data from backend as MongoDB & dynamically we can handle & shown it. Whenever we want to visit view more, then it dynamically directed to LogIn page. We can entered logging in and it rendering directly view more/details option..
  • -We used Light mode and Dark mode toggle switch
  • -So main purpose of this project for us is CRUD functionality from mongoDB database and Authentication from Firebase...
  1. LIVE LINK: https://whimsical-marigold-942cbe.netlify.app

  2. CLIENT SITE REPO LINK: https://github.com/sabbirsohag-1509/assignment-10-client-site

  3. SERVER SITE REPO LINK: https://github.com/sabbirsohag-1509/assignment-10-server-site

  4. Key Features:

    CRUD functionality - CRUD functionality allows users to Create, Read, Update, and Delete data enabling full data management and interaction between the frontend and backend systems. Firebase Authentication - Secure user registration and login system with email/password and Google Sign-In. *** Beautiful UI/UX** - Modern responsive design using Tailwind CSS and DaisyUI with gradient buttons and smooth animations. *** Private Routes** - Protected routes that require authentication to access toy details and user profile. *** Dynamic Real Estate Properties Listing** - Display toys from JSON data with detailed information (name, price, rating, seller info, quantity). *** Details Page** - View comprehensive properties information with images, descriptions and etc etc.

    *** Smart Navigation** - Automatic redirect to login page for unauthorized access with location state management. *** Interactive Slider** - Eye-catching hero section with Swiper.js carousel showcasing featured toys. *** Fully Responsive** - Mobile-first design that works seamlessly across all devices (mobile, tablet, desktop). *** Form Validation** - Password strength validation (uppercase, lowercase, minimum 6 characters) *** SweetAlert Notifications** - Beautiful success/error messages for user actions (login, logout, registration) *** Loading States** - Skeleton loaders and spinners for better user experience during data fetching etc etc..........

  5. NPM package i used:

React-Router, Tailwind, DaisyUI, React-Icons, Lucide React Icons, Swipe slider, Sweet Alert, Helmet-Asynch, Node.js, Express, MongoDB, Axios, Express, Cors, MongoDB,

About

HomeNest is a modern real estate listing web application built with React that allows users to browse, search, and manage properties easily. It uses Axios for data fetching, SweetAlert for user alerts, and Framer Motion for smooth UI animations.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages