utk145 / fullstack-property-mern

A full stack property listing web app with advanced authentication, advanced search functionality, image upload.

NewWorld Properties

Welcome to NewWorld Properties, a dynamic property listing web app that combines the power of React, Express, Mongoose, Firebase, Imagekit.io, TailwindCss, JWT, Multer, and more. This full-stack application is designed to provide users with an enhanced property listing experience, featuring advanced authentication, refined search functionality, seamless image uploads, and robust CRUD operations on listings and user-profiles.

Features

• Dynamic Property Listing: NewWorld Properties is built to dynamically showcase property listings, offering users a rich and interactive experience.

• Tech Stack:

  • Frontend: React(Vite), Redux-Toolkit, TailwindCss, Swiper, Redux-Persist
  • Backend: Express, Mongoose, bcryptjs
  • Authentication: JWT (JSON Web Tokens)
  • Cloud Storage: Firebase
  • Image Handling: Imagekit.io, Multer

• Authentication: The app boasts advanced authentication features, ensuring secure sign-ins and sign-ups using JWT for token-based authentication.

• Search Functionality: Enjoy a refined search experience with powerful search functionality, making it easy for users to find the properties that meet their criteria.

• Image Handling: Seamless image uploads are a key feature, utilizing services like Imagekit.io and Multer. Images are cached on the local server for improved performance, with proper proxies and middlewares in place.

• State Management: Redux-Toolkit is employed for efficient state management, providing a scalable and organized approach to handling application state.

• Production-Grade Practices: The application adheres to production-grade practices, including encryption and decryption during sign-ins and sign-ups to ensure the security of user data.

• CRUD Operations: Users have the ability to perform Create, Read, Update, and Delete (CRUD) operations on their property listings, providing a comprehensive and customizable experience.

Getting Started

Basic cloning

1. git clone https://github.com/utk145/Fullstack-Property-MERN.git
2. cd Fullstack-Property-MERN

For frontend

1. cd client
2. npm install --legacy-peer-deps
3. npm run dev

For backend

0. if inside client folder then type cd..
1. cd backend
2. npm install --legacy-peer-deps
3. npm start

Set up environment variables, including API keys and configuration details whose examples are present in .env.sample files in both the folders.

Contributing

All sorts of contributions are welcomed. If you'd like to contribute simply fork the repository and all set. 🚀

Click here for demo of the application.