The Philly Bikeshare Station Finder App (Hosted via GitHub Pages) was created as a hiring process challenge for a developer position at P'unk Avenue (and I got the job! 🎉 ).

This app allows a user to input an address or an intersection to see the closest Indego bikeshare stations.
A user can click on a map cycle marker to display an info-window that shows the:

• name of the station
• address of station
• number of bikes currently available
• number of open docks currently available

Additionally this app has been integrated with the OpenWeatherMap API to display the current temperature and weather conditions. If the current weather conditions threaten to create hazardous riding conditions, a red weather alert banner will become visible above the weather header.

Search area and Weather header

Search area and Weather header w/ Weather Warning

HTML/CSS/Vanilla Javascript

Bash/Git, VSCode, Cyberduck, Postman, Chrome Devtools

Indego GeoJSON (added to a Google Map as a data layer)
OpenWeatherMap API
GoogleMaps API
GoogleMaps Geocoding Service

Here's a somewhat messy but comprehensive GoogleDoc that outlines my planning for this app (including a rough mockup, user stories and user flows, checklist, etc).

I had a lot of fun making this. I learned quite a bit, hit some snags, did a lot of googling, reached out for help when needed and even did a little bit of pair programming with some trusted friends/mentors to get through some of the tougher obstacles.

Though the app technically works and (I believe) meets all the specified requirements, when the user inputs an address the map will zoom to that location but I was not able to set the proper parameters to ensure that at least 3 stations will be displayed nearby.
There's also a few of the "extra credit" features I wish I could have finished implementing such as getting the get-a-bike/return-a-bike filtering checkboxes working, adding a geolocation feature, having the marker color/style be based on bike/dock avaibility, and having both the weather and map details update in real time. I do plan on trying to implement as many of those as possible even now that the challenge duration is technically over, and I will update this when that happens.

I went over my code a lot to make sure it was consistent and had proper documentation but I am sure that it could be greatly improved with continued learning and practice with Javascript (YAY for learning and improving!).

Overall, I am both proud of and excited for what I was able to complete/accomplish/learn with this challenge, and am also definitely open to feedback on ways I could improve both my code and my process. 😄