Design
Atomic Design
화면을 작은 부품과 조합으로 동시에 바라보는 interface design system의 mental model
Design에서는 어떻게 사용하나요?
Brad Frost는 interface를 Atom, Molecule, Organism, Template, Page의 다섯 단계로 설명했습니다. 이것은 file naming이나 React directory 규칙이 아니라 부분과 전체를 함께 보는 mental model입니다. 실제 codebase에서는 domain boundary와 팀의 언어가 더 명확하다면 다른 분류를 써도 됩니다.
이 신호가 보이면 떠올리세요
- 같은 interaction이 화면마다 다름
- component 이름의 추상도 혼재
- 작은 변경이 여러 화면에 반복
함께 검색할 키워드
사이트 안에 같은 주제가 있으면 위키로, 아직 없으면 Google 검색으로 연결됩니다.
출처와 더 읽을거리
함께 보면 좋은 주제
직접 만져보는 랩
이 주제를 직접 다루는 랩은 준비 중입니다. 연결된 주제에서 먼저 감각을 잡아보세요.