This project is a React application that utilizes the Open Brewery DB API to fetch and display brewery data in an interactive way.
- Fetches brewery data from the Open Brewery DB API
- Utilizes MVP.css for minimal styling
- Implements data binding
- Utilizes destructuring for cleaner code
- Includes at least two meaningful React components
- Responsive UI
- Implements search functionality for brewery name
To run this project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/tejus07/react-open-brewery-db.git
-
Navigate into the project directory:
cd react-open-brewery-db
-
Install dependencies:
npm install
-
Start the development server:
npm start
-
Open your browser and visit
http://localhost:3000
to view the application.
This project includes the following React components:
- App: The main component responsible for fetching data and rendering other components.
- BreweryList: Renders a list of breweries fetched from the API.
- SearchBar: Implements search functionality to filter breweries by name.
This project uses two methods for styling:
- JSX Styles: Inline styles using JSX are used for basic styling of components.
- styles.css: External CSS file for class-based styling. Classes are applied dynamically based on user actions.
You can view the project on CodeSandbox by following this link.
- Feel free to explore and interact with the brewery data.
- If you encounter any issues or have suggestions for improvement, please feel free to open an issue on GitHub.
This project was created by Tejus.