사실 난 module 글자만 보면 자신감이 사라졌었는데 이제 첫 번째로 맞이하게 되었다. 문제가 되었던 라인인데 className을 .header로 쓰다보니 중첩이 되는 부분이 생긴다는 것이다. 사실 이런 문제에 대해 깊게 고민해보지 않은터라 보고 '생각해보니 그렇네'했던 나였다. 그래서 module.scss로 써서 이런 문제를 해결할 수 있다. 이런 것이 모듈화의 기본적인 목적이라고 볼 수 있다. 아래는 gpt가 알려준 모듈의 이점이다. 여기서 문제는 우리가 vite을 사용하고 있어 여기서도 호환이 되나 문제였다. 딱히 글이 나오지않았는데 스택오버플로우에서 composes 처리가 안된다는 글을 보았고(근데 댓이 없었다.) 이 것 이외의 이슈는 찾기 힘들었다. https://stackoverflow.co..

2차 프로젝트를 진행하면서 피드백을 받은 부분이 있어 살펴보고자 한다. 사실 이 부분에서 이야기를 들었을 때 한 번도 생각해본 적인 없는 부분이었다. 사실 용어부터가.... 자손 결합자, 자식 결합자라서 자식결합자는 알겠는데 자손 결합자가 뭐지 했다. 1) 자식 결합자 span { background-color: white; } div > span { background-color: DodgerBlue; } 난 뭐 거의 이렇게 썼던 것 같다. 2) 자손 결합자 li { list-style-type: disc; } li li { list-style-type: circle; } 꺽쇠를 안쓰면 하위 요소가 다 선택된다. 프로젝트에서 하위 요소가 어차피 하나 밖에 없어서 팀원 분이 그냥 자손으로 처리한 부분이 ..

아무일 없을 것 같았던 2차 프로젝트, 3일 내내 불안했던 백엔드의 의견 차이가 결국 4일 째 터져 팀원이 나가고 백엔드는 결국 나와 다른 팀원 하나가 떠맡게 되었다. 결과적으로는 백엔드 전담 팀원이 나가 최선의 결과는 아니었지만, 불화가 끝나서 다행이었다. 그래도 남은 프론트엔드 지망자들이 백엔드를 해야한다는 부담과 프론트 코드를 전혀 못 짜는 상황이 오는 건 아닌지 불안했다. 그렇게 코치님과 대화하고 우리는 파이어베이스로 백을 처리하고 프론트에 집중하기로 하였다. 그리고 다음날 로그인부터 파이어스토어까지 알아보려고 찾아보며 코드를 치던 중 문서대로 했는데 에러가 발생했다. 처음 문서를 보며 아니 로그인이 이게 끝이야? 했는데 이 말이 무색하게 처음이라 헤맸다. 근데, 한글로 되어 있는 건 진짜 정말 ..

개발을 공부하면 공식문서를 잘 읽어보라는 이야기를 하고 어떤 질문을 하면 공식 문서를 전달 받는다. 하지만, 현실에서는 모르는 것이 나오면 공식 문서를 보기보다는 유튜브나 블로그를 찾아보는 경우가 흔하다. 그 이유를 생각해보면 일단 영어를 안봐도되고 친절하게 설명해주는 내용들이 보다 쉽게 내용을 이해할 수 있다. 하지만, 최근 상황이 변했다. 이제는 뭔가 정보를 찾아보는 일이 점점 찾기 어려워지는 것 같다. 같은 문제를 마주해도 사람들이 생각하는 부분이 다르다는 생각도 든다. 나는 이런 부분을 알려줬으면 좋겠는데 이 부분은 한 절반 알려주고 다른 부분으로 넘어간다. 그러 경험이 점점 쌓이다보니 그냥 공식문서를 찾게 되는 것 같다. 게다가 기본은 아는 것 같았는데 막상 공식 문서를 읽어보면 빈 곳이 너무 ..

부트캠프 1차 프로젝트 할 때 lean()을 쓰는 것을 보았지만 나는 api 짜는 것도 바빠서 성능에 대한 것은 신경쓰지 못했다. 물론, 성능을 신경 써야할 만큼 큰 프로젝트가 아니었지만 이런 세심함이 나중에 성능적으로 큰 차이를 만들어 낸다고 생각한다. 제일 정확한 것은 공식 문서이기에 공식 문서를 드다본다. The lean option tells Mongoose to skip hydrating the result documents. This makes queries faster and less memory intensive, but the result documents are plain old JavaScript objects (POJOs), not Mongoose documents. In this ..

useCallback이나 useMemo는 불필요한 렌더링을 막기위해 사용된다. 컴포넌트 함수 호출이 필요한 경우에만 호출되야 렌더링 최적화를 이뤄낼 수 있다. 둘의 차이는 간단한데 이름에 나와 있다싶이 콜백은 함수이고 메모는 값이다. 내용은 역시나 별코딩 강의를 통해서 학습했다. 진짜 쉽게 이해시켜주는데 다시 좀 콘텐츠를 만드셨으면 한다. 리액트는 기본적으로 상태가 변하면 렌더링을 다시한다. 아래 코드에서보면 하드 넘버와 이지넘버가 상태로 지정되어 있는데 각 input의 값이 변하면 상태가 변하므로 app함수는 새로 호출될 것이다. 근데 생각해보면 하드넘버가 변하는데 easyCalculate 함수가 호출되는 것은 매우 비효율일 것이다. 반대도 마찬가지이다. 그래서 이지넘버, 하드넘버를 기억시켜 새로 함수..