Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/muhammadm1998/nuxtbnb

An Airbnb-like website. Built with Nuxt.js and using Algolia, Mapbox, Stripe, Firebase Auth and more.
https://github.com/muhammadm1998/nuxtbnb

algolia cloudinary css firebase-auth heroku html javascript mapbox-gl-js mobile-first nuxt railway-app stripe taliwindcss vue vuex webpack

Last synced: 10 days ago
JSON representation

An Airbnb-like website. Built with Nuxt.js and using Algolia, Mapbox, Stripe, Firebase Auth and more.

Host: GitHub
URL: https://github.com/muhammadm1998/nuxtbnb
Owner: MuhammadM1998
Created: 2022-06-11T00:24:04.000Z (over 2 years ago)
Default Branch: main
Last Pushed: 2022-12-11T20:28:04.000Z (about 2 years ago)
Last Synced: 2024-10-25T10:47:21.660Z (about 2 months ago)
Topics: algolia, cloudinary, css, firebase-auth, heroku, html, javascript, mapbox-gl-js, mobile-first, nuxt, railway-app, stripe, taliwindcss, vue, vuex, webpack
Language: Vue
Homepage: https://nuxtbnb.up.railway.app/
Size: 7.92 MB
Stars: 2
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # NuxtBnB

An Airbnb-like website. Built with Nuxt.js and using Algolia, Mapbox, Stripe, Firebase Auth and more.

![Website Mockup](./static/Website-Screenshot.png)

### 🔗 Links

- [Live Site](https://nuxtbnb.up.railway.app/)

- [Source Repo](https://github.com/MuhammadM1998/NuxtBnB)

### 🔨 Changelog

This project is built during the Mastering Nuxt course. I used different tools and modified things due to several reasons.

- Made the website responsive on all screens instead of desktop only.

- Enabled searching without start & end date.

- `Firebase Auth` instead of `Google Auth`.

- `Mapbox GL JS` instead of `Google Maps`.

- `Mapbox Geocoder` instead of `Google Places`.

- `Railway` instead of `Vercel`.

### 💰 Test Payment with Stripe

You can request your apartment from the site now, you can use this info for stripe checkout page.

- `Card Number`: `4242 4242 4242 4242`

- `CVC`: Enter any three numbers

- `Expiry Date`: Enter any date in the future.

### ‍💻 Stack

![Nuxtjs](https://img.shields.io/badge/Nuxt-002E3B?style=for-the-badge&logo=nuxtdotjs&logoColor=#00DC82)

![Tailwind CSS](https://img.shields.io/badge/-TailwindCSS-%231a202c?style=for-the-badge&logo=tailwind-css)

![Firebase](https://img.shields.io/static/v1?label=&message=Firebase%20Auth&color=039be5&style=for-the-badge&logo=firebase)

![Cloudinary](https://img.shields.io/badge/Cloudinary-2C39BD?style=for-the-badge&logo=Cloudways&logoColor=white)

![Algolia](https://img.shields.io/badge/Algolia-5468FF?style=for-the-badge&logo=Algolia&logoColor=white)

![Mapbox](https://img.shields.io/badge/Mapbox-4285F4?style=for-the-badge&logo=Algolia&logoColor=white)

![Stripe](https://img.shields.io/badge/Stripe-008CDD?style=for-the-badge&logo=Stripe&logoColor=white)

![Railway](https://img.shields.io/static/v1?label=&message=Railway&color=0B0D0E&style=for-the-badge&logo=Railway)

![Webpack](https://img.shields.io/badge/webpack-%238DD6F9.svg?style=for-the-badge&logo=webpack&logoColor=black)

![VS Code](https://img.shields.io/badge/-VSCode-%23007ACC?style=for-the-badge&logo=visual-studio-code)

![Mobile-First Design](https://img.shields.io/static/v1?label=&message=Mobile-First-Design&color=gray&style=for-the-badge)

Feedback is always appreciated 📝🙏