by Jordan Bortner and Corey Loftus
Check out the live deployment here.
Home/landing page for our application.
Choose your search method and query, and refine your search with sorting methods provided by the Open Brewery API.
Browse search results with the brewery name and address at a glance, and hover over an item to see if a map is available (created with React Leaflet), and what type of brewery it is. (See the Open Brewery DB API documentation for more information regarding brewery types)
See full details on each brewery's page, including the phone number, website, and location on a map (if available). 10-digit U.S. phone numbers have been formatted for readability, and some international address formats have been taken into consideration as well.
What does it do? Our Brewery App utilizes the Open Brewery DB to create a search engine that populates detailed results, and displays a map of where the brewery is.
We thought it would be fun! And a good challenge to apply our learnings about React.
We're completing this as part of General Assembly's Software Engineering Intensive 10-31-22.
Corey's brother initially suggested a project like this as part of his strategy for interviewing software engineer candidates. Jordan and Corey thought it would be fun to solve this challenge as part of a project for their Software Engineering Intensive through General Assembly.
- Presents JSON data at a glance for users to locate closest/nearest brewery to them.
- Allows user to search by the following data:
- Brewery Name
- Brewery City
- Brewery State
- Brewery Postal code
- Brewery Country
- Presents detailed contact information for brewery upon selection.
- Displays a map using API's logitude/latitude data (courtesy of Leaflet and OpenStreetMap).
- Displays how recently the data has been updated for each brewery.
- "I'm feeling drunky" - populates info for a random brewery from the database.
HTML/CSS, JavaScript, React.js, JSX, Node.js, Leaflet.js, React Leaflet, OpenStreetMap API
Bugs? Improvement suggestions? Future proposals?
Open an GH issue or PR and we'd be happy to chat.
Thanks for checking out our project!
-- Corey + Jordan