Airbnb 2.0

Project developed using experimental Next.js 13 features

Airbnb 2.0 is a booking and reservation website built with Next.js 13+ using experimental features like useNavigation for routering. The purpose of developing this application was to enhance learning in Next.js pagination structure, relational object mapping with Prisma, application state management with Zustand and data storage with MongoDB Atlas. This is a web project built with the concepts of mobile first. It also uses the most variety of front-end technologies based on ReactJs library.

Features

• Home Page with all properties listed.
• Search by property map location; search by property number of rooms, bathrooms and guests quantity; and search by date of reservations.
• Click on topics to search by each category.
• Create an account traditionaly or with Google and Github.
• Log In log out.
• Create property (set country location, number of rooms, bathrooms, guests quantity, upload property photo with cloudinary and price per night).
• Delete your own created property.
• Any reservation made on a deleted property will automatically be cancelled.
• Cancel reservations made on your property.
• Make reservations on other users properties.
• Cancel reservations made on other user properties.
• Make a reservation only on free dates.
• Favorite and unfavorite destination.
• Trips screen.
• Favorites screen.
• Properties screen.
• Reservations screen.

Requisites

Before getting started with this project, you must have installed in your machine the following developer build tools: Git, Node.js version 14.X and Yarn version 1.22.19 or latest. It's possible to install the developer build tools above using the following package managers Chocolatey for windows machines and Homebrew for MacOS machines. It's highly recommended to download VSCode to work on, as it has the most variety of extensions possible and particular advantages to code javascript applications and it's totally free. It's necessary to create your github oauth application and set the callback URL and your origin requests.

🎲 Running the project locally

# Clone the project
$ git clone https://github.com/Welber33/airbnb-clone.git

# Go to the folder where is the cloned project
$ cd folder_with_the_cloned_project

# Open the project on vscode via terminal/cmd
$ code .

# Install the dependencies
$ npm install

# Execute the application in Dev Mode
$ npm run dev

Available commands

Running commands with npm npm [command]

command	description
install	Install all development dependencies of the app
run dev	Starts a development instance of the app
build	The build script is responsible for compiling, bundling, and optimizing the project's source code and assets for production deployment

Setup .env file

DATABASE_URL=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
GITHUB_ID=
GITHUB_SECRET=
NEXTAUTH_SECRET=
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=

Techs

This project made use of the following technologies and developer tools:

• NodeJS
• NPM
• ReactJS
• NextJS
• TailwindCSS
• NextAuth
• TypeScript
• Zustand
• React Leaflet
• Prisma ORM
• MongoDB Atlas

📝 License

This project is under the MIT license. See the LICENSE for details.