컴포넌트 분리 기준에 대해서 질문드립니다.
3822
작성한 질문수 4
예를 들어 게시판 프론트 개발을 해야됩니다.
컴포넌트를 나누는 기준을 어떻게 해야될지 고민이 됩니다.
1. A 개발자 컴포넌트 기준을
- 목록 페이지
- 페이징 네비게이션
- 글작성 폼
- 읽기 폼
- 댓글 쓰기폼
- 댓글 목록
이런식으로 페이지 또는 서비스 기준으로 나누었고
2. B 개발자는
- 목록
- 검색 영역
- 버튼 영역(쓰기, 삭제 등)
- 리스트 표시(테이블)
- 단일 항목 표시(row)
- 페이지 네비게이션
- 글작성 폼
....
- 읽기 폼
...
이처럼 최대한 영역을 잘게 쪼개서 컴포넌트를 만듭니다.
B 개발자 처럼 하면 컴포넌트 깊이가 깊어지고, 불필요한 데이터 전달이 많아져 오히려 코드가 복잡해 질 것 같습니다.
실무에서는 어떤 기준으로 컴포넌트를 나누는지 궁금합니다.
답변 1
0
안녕하세요 복슬이님, 좋은 질문 주셨네요. 컴포넌트 설계는 그때그때 프로젝트 여건에 맞춰 설계하시는게 일반적입니다. 개인마다 컴포넌트를 설계하는 기준도 달라서 컴포넌트 설계 패턴이라는 주제를 별도로 학습하시기도 합니다. 저는 가급적 컴포넌트의 단위를 작게 설계하는데요. 여기서 답글로 모두 설명드리기에는 어려울 것 같고 아래에 나와 있는 여러 가지 패턴들 참고해 보시면 좋을 것 같습니다 :)
node 10버전 사용
0
64
1
강의에 대해 질문 드립니다.
0
60
1
vue CLI 대신 vite를 사용해도
1
139
2
질문삭제
0
149
2
강사님 코드로 진행할 경우 console.log( config); 도 안찍혔어요. instance 를 생성해서 공통으로 사용하셨는데 loginUser 에만 커스텀한 instance를 넣으니 콘솔에 컨피그 객체가 찍혀요
0
91
1
로그인 에러발생만하면 네트워크 커넥션 에러 발생 해결
0
117
1
rndrmagkqslek.
0
73
1
계속 따라하다가 안돼서 bash에 연결할떄 안되더라구요
0
104
1
axios 에러가 뜹니다.
1
237
2
vue3로 진행하시면서 router에서 '*' 적용이 안되시는 분들
2
312
1
vue 관련 다른 강의 출시예정이없으신지 궁금합니다!
1
154
1
AppHeader.vue에 vue 디폴트 만들에 Delete `␍` 오류나면
1
195
1
vue3로 따라오시다가 import axios 에러 뜨시는 분들
2
445
2
$router 를 이용한 메인 페이지로 이동
1
290
1
혹시 node.js 10.24 버전으로 해도 상관없나요?
2
461
2
에러 경로가 LoginForm.vue 43번째줄 말고 다른 경로로 출력됩니다.
1
298
2
pinia 사용할려고 하는데 에러가 나옵니다.
1
486
2
swagger ui의 post/posts에 글 기록하려고 하면 unauthorized 에러가 납니다..
1
1102
2
safari 개발자 도구에 대한 질문입니다
1
568
2
스웨거에 글 등록시 401 에러가 나와요 ㅠ
1
722
2
이 에러 때문에 진행이 안되네요 ㅠ
1
675
1
windows .nvmrc nvm use 실행 오류
1
1547
2
강사님 최신화가 필요해보입니다.
2
960
2
npm i 에러
1
612
1