About the project
Kebab is an ordering page for a kebab restaurant: the menu, a sidebar cart and a checkout preview. The cart lives in a React context with a reducer, because three separate parts of the tree need it at once — the add buttons on each product, the counter in the navbar and the panel that lists what you picked. Passing it down as props would have meant threading state through every layer between them.
What it demonstrates
- One cart, three consumers
- Quantities keyed by product name
- A sidebar, not a separate page
- Menu driven by data
- Styled with styled-components
Stack
- React
- React Router
- styled-components
Screenshots
Demo