로딩
요청 처리 중입니다...

열두 번째 이야기 :: 디자인 시스템(Atomic Design)

 열두 번째 이야기 :: 디자인 시스템(Atomic Design)

안녕하세요, 엔로비 이민호입니다. 오늘은 아토믹 디자인에 대해 포스팅하도록 하겠습니다.

디자인 시스템 재사용 가능한 UI 구성 요소의 모음 웹이나 앱 등 서비스 디자인에 적용된 디자인 스타일의 규칙이나 가이드라인 버튼 등 UI 요소와 텍스트 요소 및 디자인 파일에서 재사용 될 요소를 정의할 수 있는 시스템 Atomic Design (아토믹 디자인) 화학원료의 명칭을 따와서 만들어진 시스템 프론트엔드 개발 프레임워크(Vue, React 등)는 컴포넌트 단위로 개발을 진행 하는데 컴포넌트를 가장 작은 단위로 설정하고 이걸 기준으로 상위 컴포넌트를 만들어서 코드 재사용을 최대화 하는 방법. ATOMS(원자), MOLECULES(분자), ORGANISMS(조직체), TEMPLATES(템플릿), PAGE(페이지) 5가지로 구성되어 있음. 1.

ATOMS(원자) 가장 작은 컴포넌트의 형태로 더 이상 분해 할 수 없는 기본 컴포넌트. LABEL, INPUT, BUTTON처럼 기본 ...