`프론트엔드 개발자` 개형이의 벽돌집

지난 포스팅에 이어 SOLID 원칙 관련 포스팅을 보고 지난 프로젝트에 대해 회고하는 시간을 가져보고자 한다. 역시나 참고한 포스팅은 아래와 같다. https://fe-developers.kakaoent.com/2023/230330-frontend-solid/ ❗️이번에는 개방 폐쇄 원칙에 대해 기술해 볼 것이다. SRP : Single Responsibility Principle (단일 책임 원칙) OCP : Open/Closed Principle (개방 폐쇄 원칙) LSP : Liskov Substitution Principle (리스코브 치환 원칙) ISP : Interface Segregation Principle (인터페이스 분리 원칙) DIP : Dependency Inversion Princ..

프론트엔드와 SOLID원칙에 대한 포스팅을 보고 회사에서 참여했던 프로젝트에 대해 많은 생각을 하게 되었다. (물론 참여 프로젝트의 코드 품질이 좋지 않다는 생각) 따라서 포스팅의 글을 보며 참여했던 프로젝트에 대해 회상하며 반성해보고자 한다. 일종의 회고 시간. 참고한 포스팅은 아래와 같다. 좋은 포스팅 감사합니다. https://fe-developers.kakaoent.com/2023/230330-frontend-solid/ ❗️시작에 앞서 SOLID 원칙은 다음과 같다. SRP : Single Responsibility Principle (단일 책임 원칙) OCP : Open/Closed Principle (개방 폐쇄 원칙) LSP : Liskov Substitution Principle (리스코브..

🤔 프로젝트를 진행하다가 무분별하게 useEffect가 많이 사용된 곳을 본 적이 있다. 한 컴포넌트 안에 여러개의 useEffect가 있고 deps가 모두 달라 어떤 값의 변경에 따라 어떻게 동작이 수행되는지 추적하기 까다로웠던 경험도 있다. useEffect를 보통 언제 사용할까 고민해 봤다. - state 값이 변경될 때마다 특정 동작을 수행하고 싶을 때 - 초기 Mount시 data fetching 할 때 - 그 외 컴포넌트 mount시 단 한번 수행하고 싶은 동작을 넣을 때 문득 개발 중에 위처럼 쓰는 게 맞을까? 고민했고 서치를 통해 좋은 자료를 발견했다. https://www.youtube.com/watch?v=SrPebT4VBYc 위 자료의 예시를 직접 해보며 useEffect가 어떻게 동..

사이드 프로젝트 진행 중에 아이콘컴포넌트가 필요하여 제작했다. 제작한 이후 스토리북에서 확인할 수 있게 추가했는데 svg파일로 된 아이콘을 불러오지 못했다. Error: Can't resolve '@/assets/icons/bookmark-outline.svg' in '내프로젝트경로' 위와 같이 에러가 발생했다. 스토리북에서 사용하는 webpack에 문제가 있는 것 같아서 확인해 본 결과, " 스토리북에서 webpack에 file loader 기본 속성으로 svg 파일을 변환하려고 함 " svg 파일 변환을 현재 내 프로젝트 환경에서 사용하고 있는 svgr을 사용하여 변환하도록 코드를 추가해 줬다. 코드 추가는 .storybook/main.ts 에서 진행한다. // ... webpackFinal: (co..