프론트엔드 마스터: 기능 분할 디자인(FSD) 패턴 #25
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
soi-ha
reviewed
Jul 20, 2024
| - **명확한 폴더 구조:** 각 슬라이스는 고유의 폴더를 가지고 있어 그 안의 컴포넌트와 로직을 체계적으로 관리합니다. | ||
| - **독립적인 슬라이스:** 각 슬라이스는 독립적으로 개발되고 테스트될 수 있으며, 자급자족하는 피자와 같습니다. | ||
| - **재사용 가능한 컴포넌트:** 공통 컴포넌트(버튼, 입력란 등)는 일관성과 효율성을 위해 여러 슬라이스에서 사용할 수 있습니다. | ||
| 페이지 내 구성: 페이지는 슬라이스를 결합하여 의미 있는 레이아웃을 만드는데, 이는 피자 슬라이스를 접시에 배열하는 것과 같습니다. |
There was a problem hiding this comment.
markdown 파일로 보면 줄바꿈이 되어 있지만, 한눈에 보기 파일(이라고 하면 아실려나요..?!)로 보면 줄 바꿈 되어 있지 않아요!
| - **독립적인 슬라이스:** 각 슬라이스는 독립적으로 개발되고 테스트될 수 있으며, 자급자족하는 피자와 같습니다. | ||
| - **재사용 가능한 컴포넌트:** 공통 컴포넌트(버튼, 입력란 등)는 일관성과 효율성을 위해 여러 슬라이스에서 사용할 수 있습니다. | ||
| 페이지 내 구성: 페이지는 슬라이스를 결합하여 의미 있는 레이아웃을 만드는데, 이는 피자 슬라이스를 접시에 배열하는 것과 같습니다. | ||
| - **기억하세요:**이것은 단순화된 예제입니다. 실제 FSD는 더 복잡한 상태 관리, 데이터 페칭 및 슬라이스 간의 통신을 포함합니다. 그러나 이 예제는 FSD를 사용하여 React 앱을 조직하는 핵심 원칙을 보여줍니다. |
There was a problem hiding this comment.
**기억하세요:** 부분이 한눈에 보기 파일에서는 **가 그대로 들어나있네요!
|
렛서가 번역해준 글 너무 잘 읽었습니다! 제가 남긴 리뷰 수정해주시고 DM주시면 merge 해드릴게요! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
다들 해커톤에서 협업하면서 어려움은 없었나요?
저희 팀은 무수한 git 충돌 부터 작업 병목까지, 협업에서 발생할 수 있는 대부분의 문제를 겪은 것 같아요.
가장 큰 문제는 팀 내에서 합의한 이슈(task) 발행 단위와 실제 프론트 개발을 위한 이슈 단위가 일치하지 않는다는 것이었습니다.
때문에 관심사가 다른 작업들이 하나의 이슈에 섞여서 무수한 깃 충돌을 일으켰어요.
이런 문제를 해결하기 위해 '프론트 개발을 위한 task 단위'를 어떻게 나누어야 할까에 대해 의논하는 시간을 가지고 나름의 결론을 내렸습니다.
이러한 과정을 겪고 나니, 언젠가 보았던 FSD architecture가 왜 나왔는지 이해가 가더라구요.
당시에는 과하다고 생각해 흝고 넘어가기만 했는데 'task의 관심사 분리와 우선순위 선정' 관점에서 이보다 잘 정립된 방법론이 있을까 하는 생각에 관련 아티클을 번역하게 되었습니다.
물론 아직까지도 너무 세분화 되어있을 뿐더러 성급하게 도입하면 초반의 생산성을 저해할거라는 생각엔 변함 없어요. 하지만 task 분리 전략을 발전시키고 싶을 때 참고하면 좋을만한 아키텍처라고 생각합니다!
생각이 많은 요즘이라 사족이 길었네요. 아티클도 긴 글일텐데 이 모든 걸 읽을 리뷰어에게 양해를 구합니다.😅
다들 프로젝트 화이팅하세요!