Today, we'll be using Redux to build out an app to list out cocktails. We'll use the same 'Master/Detail' format that we did in lecture. We should have:
- A component to render a NavBar and any children.
- A List of All Cocktails
- A Cocktail Detail page for each cocktail.
- You must use React-Router so that visiting a given URL maps correctly to a Component.
- Create a reducer to respond to an action called 'FETCH_COCKTAILS'. This should return a new array representing the action's payload.
- Create an action creator called
fetchCocktails
that returns an action and a payload representing a list of cocktails. - In our
index.js
file, create a new store using a rootReducer (hint: You'll need to create arootReducer
using combineReducers) - Once you create the store, wire it up to the neccessary components using
Provider
,mapStateToProps
, andconnect
- Before rendering your app to the DOM, go ahead and dispatch your
fetchCocktails
action.
This is hard. It's supposed to be hard. Work together - you guys can do this!