프로젝트에 적용할 디자인 패턴.
기본적으로 폴더 하위 컨벤션은 소문자로 하며 띄어쓰기는 - 로 통일
ui는 chardcn 컴포넌트가 install되는곳
chart는 따로 분류하기로함, icon도 마찬가지.
components 하위에 다음과 같은 디렉터리가 존재한다.
아토믹 패턴
common 하위에
#Atoms #Monocles #Organisms 디렉터리가 정의 되어있고
해당 역할에 맞는 그룹을 가진 디렉터리를 상위로 가진다. ex) buttons, progress-bar
#Atoms #Monocles 은 같은 하위 디렉터리 (inputs, buttons, searchBars)등을 가질것으로예상됨.
⇒ storybook 경로 문제발생해서 특문은 붙이지 않아야할것같다
아래는 gpt 답변
null 바이트(
\x00)가 포함되어 있다는 것입니다. 이 문제를 해결하려면 null 바이트가 포함된 경로를 수정해야 합니다. # 문자를 포함한 경로가 문제가 될 수 있으므로, 이를 제거하고 경로를 수정해보겠습니다.
또한 특수한 역할ex)modals 같은경우는
참고한 블로그에서는
@Modals 처럼 정의했는데 공용으로 쓰이는 특수한 컴포넌트들은 해당 방법을 따라도 좋을것 같음.
organisms 애매함.
organisms은 좌측 아래와 같은 구조에서 우측의 컴포넌트의 집합일것같은데
page는 nextjs의 page가 완전히 대체해서 page는 추가하지 않기로했다.
하지만 organisms 같은경우
nextjs approuter 의 page의 하위 _component가 organisms의 기능을 대체하고
parallel route을 사용하면 navigation같은 공용 컴포넌트도 대체할 수 있을것같지만
아래와 같이 공용으로 쓰이는 organism이 있을 수 있기 때문에 organism은 유지하기로함.
