컴포넌트의 분리(Container / Presenter)

kimdev·2022년 5월 22일
0

컴포넌트/프레센터 방식의 파일구조

파일을 구조화하는 방법에는 여러가지가 있다.
나는 그중 container/presenter 방식을 배웠고 이를 활용 할 예정이다.

이 방식은 아주 간단하게 파일을 나눈다.

page디렉토리안에 모든것을 연결할 index파일을 하나 만든다.

그리고 javaScript와 기능적인 부분을 src라는 폴더안에 container라는 이름을 붙여
만든다.

presenter파일에는 jsx를 사용하고

queries파일엔 API 관련 코드를 사용하고

styles파일엔 css관련 코드를 적는다

이렇게 기본적으로 4가지 파일로 나눠서 사용하고 필요에 따라 더 세분화 할 수도 있지만
너무 복잡하니 제발4가지로 끝낫으면 좋겠다.

어쨋든 이 방식의 장점은 에러가 나는 부분을 쉽게 찾을 수 있고, 한 파일의 코드의 길이가
줄어든다는 게 장점이다.

즉 유지보수가 편리해진다는 것이다.

그리고src안의 디렉토리에서도 commons와 component로 나뉘고 component안에는
이게 어떤거에 관련되있는지 알수 있게 네이밍을 한다.

네이밍이 관건이다.
(변수이름 추천해주는 익스텐션 있으면 좋겠다 ㅎ..)

0개의 댓글