![]()
참고한 사이트 https://javascript.plainenglish.io/5-advanced-react-patterns-a6b7624267a6 github: https://github.com/alexis-regnaud/advanced-react-patterns/tree/main/src/patterns/control-props https://velog.io/@dnr6054/%EC%9C%A0%EC%9A%A9%ED%95%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8-%ED%8C%A8%ED%84%B4-5%EA%B0%80%EC%A7%80 ✨ Control Props Pattern 장점: 모든 상태들을 제어 및 소유하고 있는 특정 컴포넌트가 있기 때문에, custom logic을 삽입할 수 있습니다. ..
![]()
참고한 사이트 https://javascript.plainenglish.io/5-advanced-react-patterns-a6b7624267a6 github: https://github.com/alexis-regnaud/advanced-react-patterns/tree/main/src/patterns/compound-component https://www.patterns.dev/posts/compound-pattern/ https://velog.io/@dnr6054/%EC%9C%A0%EC%9A%A9%ED%95%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8-%ED%8C%A8%ED%84%B4-5%EA%B0%80%EC%A7%80 https://www.youtube.com/watch?v=aAs36U..
![]()
React에서 여러 개의 컴포넌트를 렌더링 할 때, map() 메소드를 이용합니다. 🐣 map() 메소드를 사용하면 새로운 배열을 반환하는데, JSX에서 배열이 어떻게 출력되는지 궁금해졌습니다. import React from 'react'; export default function Map() { const products = ['상의', '하의', '모자']; const listItems = products.map((product) => {product}); console.log(products); console.log(listItems); return ( {products} {listItems} ); } 먼저 console.log 결과를 보면, listItems는 배열이 맞습니다. const pro..
