{"id":18255097,"url":"https://github.com/vicktorms/airbnb","last_synced_at":"2026-04-13T01:39:54.427Z","repository":{"id":162301062,"uuid":"629751261","full_name":"VicktorMS/Airbnb","owner":"VicktorMS","description":"Recreate the look and feel of the old Airbnb website with a fully responsive and semantic UI using React, Material UI, React Hooks, React Router, and hosted on Vercel. Explore best practices and modern technologies while building reusable and modular components.","archived":false,"fork":false,"pushed_at":"2023-05-06T01:58:48.000Z","size":35204,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-08T21:49:24.370Z","etag":null,"topics":["material-ui","mobile-first","react-hooks","react-router","reactjs"],"latest_commit_sha":null,"homepage":"https://airbnb-based-app.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/VicktorMS.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-19T00:37:31.000Z","updated_at":"2023-08-03T20:31:18.000Z","dependencies_parsed_at":null,"dependency_job_id":"186086df-b6cd-4952-8b8f-83505f36da14","html_url":"https://github.com/VicktorMS/Airbnb","commit_stats":null,"previous_names":["vicktorms/airbnb"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VicktorMS%2FAirbnb","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VicktorMS%2FAirbnb/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VicktorMS%2FAirbnb/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VicktorMS%2FAirbnb/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/VicktorMS","download_url":"https://codeload.github.com/VicktorMS/Airbnb/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247934808,"owners_count":21020724,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["material-ui","mobile-first","react-hooks","react-router","reactjs"],"created_at":"2024-11-05T10:14:40.418Z","updated_at":"2026-04-13T01:39:54.357Z","avatar_url":"https://github.com/VicktorMS.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://cdn4.iconfinder.com/data/icons/socialcones/508/Airbnb-256.png\" width=\"50\" /\u003e\n  \u003ch1\u003eAirbnb based landing page\u003c/h1\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg alt=\"GitHub repo size\" src=\"https://img.shields.io/github/repo-size/VicktorMS/airbnb-based-app\"\u003e\n  \u003cimg alt=\"GitHub language count\" src=\"https://img.shields.io/github/languages/count/VicktorMS/airbnb-based-app\"\u003e\n  \u003cimg alt=\"GitHub last commit\" src=\"https://img.shields.io/github/last-commit/VicktorMS/airbnb-based-app?color=%231280BF\"\u003e\n  \n  \u003cdiv\u003e ↪️ \u003ca href=\"https://airbnb-based-mgcn9waao-vicktorms.vercel.app/\"\u003eAccess Deploy\u003c/a\u003e \u003c/div\u003e\n\u003c/div\u003e\n\n\u003ch3\u003e📺 Preview\u003c/h3\u003e\n\n![GIF animado](assets/Airbnb.gif)\n\n\n## 📝 About\n\u003cp\u003eThis project was developed based on the layout of the old Airbnb website. The aim was to recreate the look and feel of the original design while ensuring that the page is fully responsive and follows semantic HTML principles.\u003c/p\u003e\n\u003cp\u003eThroughout the project, I made use of React's component-based architecture to build reusable and modular UI components. This approach allowed me to efficiently manage and organize the different parts of the application, promoting code reusability and maintainability.\u003c/p\u003e\n\u003cp\u003eThrough this project, I had the opportunity to explore and experiment with the best practices and latest technologies in the industry. Some of the key technologies and tools I incorporated into this project include:\u003c/p\u003e\n\u003cul\u003e\n  \u003cli\u003eMaterial UI\u003c/li\u003e\n  \u003cli\u003eReact Hooks\u003c/li\u003e\n  \u003cli\u003eReact Router\u003c/li\u003e\n  \u003cli\u003eVercel Hosting\u003c/li\u003e\n  \u003cli\u003eFlexbox\u003c/li\u003e\n  \u003cli\u003eDate Picker\u003c/li\u003e\n  \u003cli\u003eResponsive\u003c/li\u003e\n\u003c/ul\u003e\n\n\n## 🛠️ Technologies\n![NPM](https://img.shields.io/badge/NPM-%23CB3837.svg?style=for-the-badge\u0026logo=npm\u0026logoColor=white)\n![Vite](https://img.shields.io/badge/vite-%23646CFF.svg?style=for-the-badge\u0026logo=vite\u0026logoColor=white)\n![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge\u0026logo=react\u0026logoColor=%2361DAFB)\n![React Router](https://img.shields.io/badge/React_Router-CA4245?style=for-the-badge\u0026logo=react-router\u0026logoColor=white)\n![MUI](https://img.shields.io/badge/MUI-%230081CB.svg?style=for-the-badge\u0026logo=mui\u0026logoColor=white)\n![Vercel](https://img.shields.io/badge/vercel-%23000000.svg?style=for-the-badge\u0026logo=vercel\u0026logoColor=white)\n![Git](https://img.shields.io/badge/git-%23F05033.svg?style=for-the-badge\u0026logo=git\u0026logoColor=white)\n![CSS3](https://img.shields.io/badge/css3-%231572B6.svg?style=for-the-badge\u0026logo=css3\u0026logoColor=white)\n![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge\u0026logo=html5\u0026logoColor=white)\n\n## 🛍️ Future Features\n\nThis web application was designed for future API consumption receiving inputs from the date-range-picker component. In the future I would like to implement the search system, the react-query library, CSS modules and some animation techniques to make the app nicer and smoother.\n\n## 🏁 Getting Started\n\n### Programs to be installed\n- NPM\n\nClone the project and access the project's folder:\n\n```bash\n$ git clone git@github.com:VicktorMS/airbnb-based-app\n$ cd airbnb-based-app\n```\nOnce cloned you can delete the `assets` folder\n\n### Install dependencies and run the project\n\n```bash\n$ npm install\n$ npm run dev\n```\n\n\n## ⚙️ My Development Tools\n![Visual Studio Code](https://img.shields.io/badge/Visual%20Studio%20Code-0078d7.svg?style=for-the-badge\u0026logo=visual-studio-code\u0026logoColor=white)\n![Linux](https://img.shields.io/badge/Linux-FCC624?style=for-the-badge\u0026logo=linux\u0026logoColor=black)\n![Shell Script](https://img.shields.io/badge/shell_script-%23121011.svg?style=for-the-badge\u0026logo=gnu-bash\u0026logoColor=whit)\n![Linux Mint](https://img.shields.io/badge/Linux%20Mint-87CF3E?style=for-the-badge\u0026logo=Linux%20Mint\u0026logoColor=white)\n\n## 🔑 License\n\nThis project is under the MIT license. See the file [LICENSE](LICENSE) for more details.\n\n## 🎯 Author\n\n\u003cp\u003e\n\tMade by \u003ca href=\"https://www.linkedin.com/in/victor-moraes-43006a112/\"\u003eVictor de Moraes\u003c/a\u003e\n\u003c/p\u003e\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvicktorms%2Fairbnb","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvicktorms%2Fairbnb","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvicktorms%2Fairbnb/lists"}