made by kelbwah

Deployed with Vercel: Live Deployment on Vercel

This is a full stack Airbnb clone that mimics the front end UI design of the current Airbnb website. This implements the repsonsive design of their website with my own little twist! This lets users save their own state and stay logged in even after closing the tab, users can Airbnb their own home and filter out through different listings. It also uses jsonwebtoken and bcrypt for basic user authentication and password encryption and decryption. Using AWS a user is actually able to upload their Airbnb listing photos and their own profile pictures as well.

1. Clone this repo into your own computer using "git clone https://github.com/kelbwah/Airbnb-Clone.git"
2. Change directory (cd) into the client folder and run "npm i" then do "cd .." to go back to the root directory
3. Change directory (cd) into the api folder and run "npm i"
4. You will need to create your own .env file to be able to let API requests work and to add in photo upload functionality with AWS, so first make sure that you have created your own free AWS File Storage Bucket and save the ACCESS_KEY, SECRET_ACCESS_KEY, and the BUCKET_NAME.
5. You will also need to create your own test MongoDB cluster so make a MongoDB cluster and make sure to keep note of your password and get the connection string. Once you have the connection string, we will use that inside the .env file as well.
6. Also create a random secret key with a mix of numbers, special characters, and letters as a jsonwebtoken secret which will be set as JWT_SECRET in index.js
7. Now, create a .env file in the api folder and setup the environment variables like this:

8. Change the cors origin to "http://localhost:3001" in the index.js file
9. In App.jsx which can be found in the 'client/src' folder, change the axios.defaults.baseURL to "http://localhost:3001/api"