ReadMe written by Alex Myers.
This site was deployed on Heroku by Alex Myers.
Location Station is a responsive website built with React utilizing multiple API's between NASA, OpenWeather and Ticketmaster. It fetches through each to give you information relevant to your immediate area.
- Needed to be built within 72 hours with no guidance or help from ElevenFiftyAcademy instructors.
- Originally distributed between three teammates.
- Pulls in location of the user.
- Applies that location to all API's to return their results.
- Change between farhenheight and celsius for weather.
- Finds 5 different events in the upcoming days nearby.
- Displays a picture of NASA of your general area.
Location Station used the following technologies and resources:
- MDBootstrap - Material Design Bootstrap used for styling.
- React - Incoroporates useState and useEffect hooks.
- TicketMaster API - Fetched to pull event information.
- NASA API - Fetched to pull satellite image.
- OpenWeather API - Fetched to bring in weather information.
| Portfolio Sites | Direct Link |
|---|---|
| GitHub | github.com/Alex-Lee-Myers |
| linkedin.com/in/alexleemyers | |
| Portfolio | alex-lee-myers.github.io/ |
Component Responsibilities:
- Heroku Deploy
- Deployed to Heroku.
- Landing Page
- Created a landing page that is a very straightforward call-to-action button that prompts the user with agreement upon hitting the button to use their location. Once doing so, they are navigated to the Home Page.
- Home Page
- Designed the home page layout. The background incorporates a mask and scales properly with screen size. A very obvious cardgroup is centered on the screen for users to see their information.
- NavBar (Location Bar)
- A muted NavBar that shows the user a Google Maps link which takes them to their location through Maps, their exact GPS coordinates, and a link to their respository.
- NASA API
- Backend: Incoroporated the NASA API by fetching its satellite image.
- Frontend: Correctly placed the image and its context within the cardgroup so its responsive on all pages.
- OpenWeather API
- Backend: Fetched the weather. Converted the temperature from kelvin to Celsius. Additionally, converted the temparature from Celsius to Fahrenheight.
- Frontend: Integrated into the main card group. Fetched with a button. Once fetched, another button appears to change between F/C.
- TicketMaster
- Backend: Initially performed by developer Devin. Changed the fetch to become dynamic based on user's location.
- Frontend: Designed in order to show correctly on load within the card group utilizing a scroll feature if the list is too long. Fluidly absorbs into the main card group.
Component Responsibilities:
- TicketMaster
- Backend: Fetched a list of latest 5 events from the user's location.
- Frontend: Contained the fetch call within the cardgroup.
Component Responsibilities:
- NASA API
- Backend: Originally responsible for getting the NASA API to function. Due to debugging roadblocks, the responsibility was shifted over to teammate Alex Myers.