Airbnb Clone
Built with Next, Tailwind CSS and Mapbox. Based on Sonny Songha's Airbnb Clone tutorial. Live demo here.
Table of Contents
- General Info
- Technologies Used
- Features
- Screenshots
- Project Status
- Room for Improvement
- Acknowledgements
General Information
- I wanted some experience using Next as I'm getting more into React and loved the simplicty of the framework. Routing and SSR were a bit difficult to get to grips with initially but the more work with it, the better. As I'm working more on a component based architecture through React and Next, I can see the benefit of building applications using these libraries and frameworks.
Technologies Used
- Next - v12.1.5
- React - v18.0.0
- MapboxGL - v2.8.2
- Date-FNS - v2.28.0
Features
- Responsive media sizing through Tailwind
- Page routing through Next Router
- Loading bar to show loading progress using Bar-of-progress library from @badrap
- Selectable calendar
- Map, both draggable and resizable, through Mapbox
Screenshots
Project Status
Project is: complete
Room for Improvement
- Pin location information inconsistantly pops up on map, need to find out why
- Spacing on mobile for the search results could be a bit cleaner
Acknowledgements
- This project was based on this tutorial from Sonny Sangha.