Overview of My Submission

This is a simple full stack demo app that was built with:

Frontend: React, Material UI, Google Maps Javascript API
Backend: Express (Node.js), MongoDB Atlas
Database: MongoDB

This app makes use of the sample data sets of Airbnb, provided by MongoDB. It demonstrates the use case of geoWithin operator to perform geographical search in a smooth and fast way. Wanted to create an autocomplete (real time retrieval of database index field), but came across this available test dataset from the documentation (geoWithin - MongoDB Atlas), and found out that this geoWithin is more powerful than I thought.

Demo

In this app, user can search type in the keyword and pin the desired location (right click on the map), and while you type, it is retrieving data on the pre-indexed fields from MongoDB and presenting them as suggestions to the users. Creating different types of index fields were easy, as I found on YouTube the exactly thing that I wanted to do.

Basically, both the search filters (keyword and the location selected) were combined to produce the search results. If you right click and select the location, it will try to find in a circle shape (you can define in your GeoJSON), and with a radius of 10km (you can also define thsi in GeoJSON). By providing keywords, it will further filter down those properties that match the "name" field of the property.

Submission Category:

E-Commerce Creation / Own Adventure

Link to Code

Additional Resources / Info

Click on the link to check out this demo app:
Live Demo

Follow me on Medium