Daniel Garcia submission#71
Conversation
| @@ -0,0 +1,18 @@ | |||
| import { injectGlobal } from 'styled-components'; | |||
| font-family: sans-serif; | ||
| } | ||
|
|
||
| .AppContainer { |
There was a problem hiding this comment.
I use .AppContainer in 2 places, the header and the entire app. Is there a better way to do it?
There was a problem hiding this comment.
Yes, you shouldn't use classnames, you can create an AppContainer with Styled componets that implements this. Check https://www.styled-components.com/docs/basics#getting-started
There was a problem hiding this comment.
Makes sense! Thanks!
I also have the class mt that is just a margin top. Do you an example of how to handle this without css classes?
There was a problem hiding this comment.
haven't used mt before, so I believe that it has a css that you can copy. (Sort of thing I did with BootStrap buttons)
| try { | ||
| const response = yield call( | ||
| fetchGifs, | ||
| `${api_base_url}/trending?api_key=${process.env.REACT_APP_GIPHY_API_KEY}&limit=15` |
| const { gifs, favorites } = this.props; | ||
|
|
||
| return ( | ||
| <div className="AppContainer mt"> |
There was a problem hiding this comment.
don't use classnames, avoid global css
| @@ -0,0 +1,14 @@ | |||
| import { createAction } from 'redux-actions'; | |||
|
|
||
| const failedSearchGifs = createAction(SEARCH_GIFS_FAILED); | ||
| const receivedSearchGifs = (payload = {}) => ({ type: SEARCH_GIFS_RECEIVED, payload }); | ||
| const searchGifs = (payload = {}) => ({ type: SEARCH_GIFS_GET, payload }); |
There was a problem hiding this comment.
Why did you mix the usage of createAction and a manual declaration?
There was a problem hiding this comment.
I followed this files as examples: https://github.com/wizelineacademy/redux-course/blob/master/src/actions/cryptoPrices.js, https://github.com/wizelineacademy/redux-course/blob/master/src/actions/transactions.js.
I didn't know that there's a different way to do it.
| try { | ||
| const response = yield call( | ||
| fetchGifs, | ||
| `${api_base_url}/search?q=${payload}&api_key=${process.env.REACT_APP_GIPHY_API_KEY}&limit=15` |
No description provided.