문제에 대한 한줄 요약

• Problem - 현재 어떤 문제, 혹은 질문이 있는지
• Reason - 해당 Problem의 이유, 문제가 되는 사유가 무엇인지
• Try to solve - 문제를 해결하기 위해 어떤 시도를 했고, 조사한 사항은 어디까지인지 ( 중요 )
• ( Option ) Alternative - 문제를 해결하지 못할 경우의 대안

#1

• Problem - 관리해야하는 데이터가 props를 통해 깊이 전달되면서 해당 데이터를 사용하지 않는 컴포넌트들에도 전달이 되는 문제. 의존성 ⬆️
• Reason - 필요한 데이터를 props로 전달
• Try to solve - context API를 통해 전역으로 카테고리 데이터를 관리. CategoriesContext 내에 관련된 모든 로직을 두고 useCategories 함수를 만들어 접근 가능하도록 작성.
• react query를 사용해 데이터가 필요한 컴포넌트에서 axios 요청을 하고, 캐싱으로 관리

#2

• Problem - react-slick 슬라이더 컴포넌트 중 특정 슬라이더에만 슬라이드 간 여백을 줘야 하는데 연결된 css 파일을 변경하면 전체가 변경되는 문제.

• Reason -

• Try to solve - tailwind-styled-component를 통해 tw(Slider)의 방식으로 Slider 스타일 확장하고, 새로운 스타일 덮어쓴 후 해당 컴포넌트를 기본 Slider 대신 활용

  react-slick 슬라이드 간 여백 주기 / tailwind에서 자식 컴포넌트에 스타일 주기 (tailwind-styled- components에서 자식 컴포넌트 지정하기)