Inspired by the Uber Coding Challenge, this web app provides a way to find nearby food trucks in San Francisco.

The app is hosted on Github Pages here.

Note: Because of strange behavior from the Google Maps API, markers may not load on the subsequent accesses of the page. This is probably because the page is being cached on your browser and the GET requests to the Google Maps javascript files are returning 304 status codes. If so, please open a new browser and access the page. If problems persist, you can run it locally by first cloning this repository and running:

python -m SimpleHTTPServer 8080 and going to localhost:8080

Functionality

A user can do a general browse through the map selecting filters such as food categories or distance to help narrow their search. They can also input their location to visually see what food trucks are nearby to them. On-click of a food truck marker, it pulls up the name, the address, and the main type of food the truck is selling. If more fields in the dataset were available, I would have tried to either provide a website or a contact number so that a user could find out more about a particular food truck.

Technology

Making use of the Google Maps API, the app was built primarily with HTML, CSS, and Javascript in particular jQuery. It is a static, single web page app that uses data available on DataSF: Food Trucks. Since the data is not too large, and does not require the infrastructure of a database to manage (although one can be easily set up for this), I opted to save the data in a CSV format.

Data processing, especially food category generation was handled using R, a tool I'm most comfortable with to handle data manipulation tasks. Because of the limitations of the dataset, there could definitely have been more features like additional filters and reviews shown.

alt tag

Note for the reader:

While my primariy interests are in data science and data engineering, one of the key aspects of those roles is the ability to be able to tell a story with the data. This can involve creating visualizations and tools that can help communicate whatever data is provided. Thus, even though web development and frontend work are not my main forte (I've actually only dabbled in these technologies in the past year so am still quite fresh!), they are skills worth having and developing and I'm glad I was able to showcase some of them through this app.

Feel free to reach out to me on LinkedIn!

Built With

Share this project:
×

Updates