C L E M E N T

One night accommodation – Cordova App

A search for short-term rentals around you

Overnight Stay is a prototype client-side Airbnb-style application. The application mainly consists of 4 screens.

Home screen :

On this screen, a list of available housing is shown, when the app is first launched it displays a list of default places. Following a search in the search screen, the flats/houses/studios that fit the criteria will instead show up on this page as well. A tap on one of the listings starts the detailed view.

Search screen :

This screen includes an interactive map in JavaScript. It is possible to filter the price as well as the distance from the user or the address typed in the search bar. Once that info is sent, the map actualizes and only shows the corresponding proprieties. A tap on one of the markers shows snapshot info for the property it represents and possesses a button to see the detailed page for it.

Detail screen :

The screen shows the details of a property, with a button that leads to the reservation screen.

Démonstration :

You can see a demonstration of the app before the reservation screen was added here :

https://youtu.be/arnALMXhQ9Q

Reservation screen

On this screen, the user fills in their personal information and then the duration of their stay. Then, when they press the confirmation button, the info is sent to the database and the property won’t show up again on the map or home screen before the end date is reached.

Technical side :

The application was programmed with the Cordova framework to allow compatibility with both Android and IOS. It is coded like a web app in JavaScript, the data is fetched with a custom PHP API on a remote server. Some property images do not show up because we used an existing dataset containing the Airbnb listing of Quebec City for this proof of concept. Since then some of the images have been removed from the server hosting them.

French version :

Logement d’une nuit – Cordova App

Related Tags:
Social Share:

Leave A Comment