분류 전체보기212 React 음식 정보 렌더 컴포넌트를 재활용하도록 만들 수 있을까? 처음 설계는 빨간색, 초록색 박스처럼 각각의 컴포넌트를 만들고자 하였습니다. (같은 색은 동일한 컴포넌트 입니다) 하지만 이 박스들도 재활용할 수 있도록 만들 수 있다고 생각하여 다음과 같이 하나의 컴포넌트로 만드는 대신에 공통되는 외의것인 카테고리 타이틀, 탭은 주입받을 수 있도록 하였습니다. const MainCard = ({ mainCardData }) => { return ( ); }; const SubCard = ({ mainCardData }) => { return ( ); }; 카테고리 타이틀, 탭의 컴포넌트 자체를 위와 같이 CardContainer에 주입하였습니다. 그리고 아래와 같이 CardContainer에서 children으로 태그들을 받도록.. 2022. 4. 24. 리액트 app 설계 컴포넌트 계층 구조로 그려서 나누기 state사용없이 정적인 UI, 규모가 크지 않다면 하향식 최소한의 state 찾기 부모로 부터 props로 전달 받는 경우 시간이 지나도 변하지 않는 경우 컴포넌트 내 다른 state나 props로 구할 수 있는 경우 state가 아닌 경우 state가 어디에 있어야 할지 찾기 state 기반으로 렌더링하는 모든 컴포넌트를 찾아서 가장 최상위의 컴포넌트에 위치 역방향 데이터 흐름 추가하기 상위 컴포넌트의 state를 업데이트하는 코드를 담은 콜백함수를 하위 컴포넌트로 전달하여 하위 컴포넌트의 state가 변화해야하는 위치에서 호출 참고 : https://ko.reactjs.org/docs/thinking-in-react.html 2022. 4. 19. 2022-04-02 TIL 정해진 시간 내에 코딩테스트 문제 푸는것이 정말 부족하다. 그래서 오늘 한 문제라도 푸는것을 목표로 원티드 쇼미더코드를 봤다. 한 문제 푸는데 메모리 초과가 나왔다... 백준은 특히나 문제 읽는것이 집중하기가 힘들다. 백준으로도 꾸준히 풀어봐야겠다. 저번에 시도하다가 풀지 못했던 BFS문제를 해결하였다! 풀고보니 별거 아니었다. 이전보다 조금씩 더 풀리다보니 풀맛이 난다. 근데 안 풀릴때 집중력이 확 떨어진다... 안 풀릴때도 집중하도록 자주 코테를 참여하려고 한다. 집중하는것이 관건인데 요즘 정말 집중해서 하는지 의심이 간다. 다시 뽀모도르 학습법으로 간다. 토익 공부를 하고 있다... 이제는 더이상 미룰 수가 없다. 제발 토익도 꾸준히 하자... 2022. 4. 3. MVVM패턴 이전글 - MVC패턴 MVVM은 어떻게 등장하게 되었을까? view에서 처리하는게 많아져서 주도권을 view가 가져가게된것도 있고 controller에 view관련 코드가 많아져 controller가 비대해졌기 때문이라고 생각한다. 그래서 view에서 viewModel을 조작하는 MVVM이 등장한게 아닐까? MVVM패턴에 대하여 학습하면서 나름대로 간단한 예제를 작성해보고 피드백을 받으면서 수정해보았다. 먼저 처음에 나름의 논리로 작성한 예제들이다. 기본적인 Model, View, Controller의 역할이 무엇인지 정의한것은 이전글에 작성하였다. 같은 팀원과 다양한 블로그들을 보면서 각 용어를 어떻게 정의하느냐에 따라 조금씩 다른 부분이 있다고 생각하여 미리 그 용어를 확실히 정의할 필요성을 느꼈다... 2022. 4. 1. 이전 1 2 3 4 5 6 7 ··· 53 다음
