The Punk API uses the BrewDog API to display a collection of their finest drinks.
A user can search for a particular brew they like via the searchbox, or filter the results to their liking.
In this project, props were needed to be passed down component trees (prop drilling), and data transmitted around using functions as props (e.g. the search term from the input in the navbar must have the data passed to the cards to display the correct brews.
I learned a lot about props and their use in Functional React in this project, as well as learning to use an API efficiently to make as few calls as possible through storing data locally (temporarily).
React is great for building scalable development ecosystems, I really enjoy the use of components as it makes the code easier to break down into small chunks, and easier to work on in large groups (by breaking it up).
This site uses the following languages, principles & softwares:
- Functional React
- HTML
- SCSS / CSS
- Postman
And of course my Punk API itself is open source, so feel free to pick and choose bits you like to host on your own GitHub!
- Login system (google)
- Add favourite brews to your account favourites
If you wish to run the project for yourself after downloading the code
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.