Chaya Otikor: Stretch#239
Chaya Otikor: Stretch#239cotikor-public-plaid wants to merge 3 commits intobloominstituteoftechnology:masterfrom cotikor-public-plaid:master
Conversation
szincone
left a comment
szincone
left a comment
There was a problem hiding this comment.
Great project. I love that you're still using things we've learned in past project. You also seem to be getting on another level w/ styled-components, I'm learning a lot from reviewing your code, especially when it comes to styled components.
|
|
||
| import NavBar from './components/NavBar'; | ||
|
|
||
| const GlobalStyle = createGlobalStyle` |
There was a problem hiding this comment.
Good job incorporating styled-components. I really didn't like them at first and stopped using them after last week, but I've since started using them more and more and I'm a big fan now. They are really powerful, I just didn't understand them. I'm glad your using them.
|
|
||
| export default App; | ||
|
|
||
| App.propTypes = { |
There was a problem hiding this comment.
Great job incorporating things from the previous lessons. I haven't seen anybody use prop-types on this assignment yet. It's great that your keeping you skills strong.
| <React.Fragment> | ||
| {props.list.slice(1, 7).map((item, index) => | ||
| item.name === category ? ( | ||
| <React.Fragment> |
There was a problem hiding this comment.
The key always needs to be in the parent of whatever your looping or mapping over. So if you moved the key={index that you did on line 43, inside this fragment like this <React.Fragment key={index}>, you would get rid of that error message in the console.
| import PropTypes from 'prop-types'; | ||
| import { keyframes } from 'styled-components'; | ||
|
|
||
| const fadeIn = keyframes` |
There was a problem hiding this comment.
You're getting really good with styled components.
| <Route | ||
| path={'/:category'} | ||
| render={({match})=> | ||
| <SubNav {...props} list={props.list} match={match}/>} |
There was a problem hiding this comment.
The {...props} includes match, location, and history. You use those a lot in React-Router so anytime you see {...props}, it's passing those 3. So you don't really need to pass match down. (although the way you did your assignment, you still need to pass it down, because just changing line 26 match to props breaks the whole thing.)
2 participants
No description provided.