본문 바로가기

asharyu3

오픈소스 디자인 시스템 만들기 -4- 1. 베이스가 될 컴포넌트들을 만들다보니 컴포넌트에 대한 커스텀 권한이 어느 정도가 되어야할지 적정한 선에 대한 고민이 있다. 디자인에 맞게 변형이 너무 힘들면 그것도 불편하고 그렇다고 디자인 시스템을 너무 변형해서 사용하는 것도 디자인 시스템이라는 목적성에 맞는지 모르겠다. 오픈소스로 개방하고 개인적으로 여러 도메인에서 사용할 생각이라 변형이 쉽게 설계하고 개발하고 있긴하다. 기존의 antd나 부트스트랩 머테리얼 디자인등을 참고중 인데 해당 부분들이 UI 라이브러리긴 하지만 순수하게 디자인 시스템이라고 보긴 힘들어서 그런점도 있고 cloudscape-design와 같이 특정 도메인에 종속적인 느낌으로 가기엔 아직 결정한게 없다. 2. 컴포넌트 자체의 복잡도가 서로 다른 점 해당 시스템을 실제로 적용해서.. 2022. 11. 29.
오픈소스 디자인 시스템 만들기 -3- 1. 디자인 툴로 emotion과 styled 방식의 css in js를 선택했으나 사실 굳이 두가지 방식을 고집할 필요성을 검토 해본 결과 찾지 못했고 오히려 오픈소스로 여러 환경에서 적용하려면 import css 방식으로 베이직하게 하는게 더 효율적이라는 것을 느꼈다. 사실 순수하게 개인이 자주 쓰던 기술이라는 이유로 별 고민없이 선택한 기술 스택에 가깝다. 그래서 먼저 디자인 시스템 1.0버전이 완성시키고 추후 걷어내기로 결정. 일단 지금은 그냥 css in js를 이용해서 편하게 만들어 보기로 했다. 2. 디자인 요소를 시맨틱하게 컨셉을 잡은 것은 좋으나.. 어느 도메인을 메인으로 타겟팅 할 건지 생각을 안해서 그런지 작업상 장애요소가 상당히 많음. 디자이너가 아니다 보니 더욱 그런듯. 큰틀에서 .. 2022. 11. 12.
오픈소스 디자인 시스템 만들기 -2- 웹프론트 개발에서 스토리북은 매우 유용하다. 웹페이지를 개발을 할때 기능 단위, 그리고 좀 더 세분화 하면 컴포넌트 단위로 개발을 진행하게 되는데 웹프론트의 경우 UI를 개발하다보니 로직에 대한 테스트를 jest나 테스트 도구로 자동화 테스트를 진행한다고 해도 사실 실제로 보이는 부분(굳이 구분 하면 퍼블리싱)이 어떤지 컴포넌트와 각 조합마다 확인을 해야하는 상황이 생긴다. 마크업이라는게 수치적으로 자동화하는 것으로 끝나는게 아니라서 그런거 같다. 어쨌든 그런 경우 결국 E2E방식으로 확인을 해야하는데 스토리북이 없다면 기존의 개발중인 웹어플리케이션에 지금 개발하는 부분들을 연결해서 실행시키고 테스트를 돌려야 하는 등 여러 귀찮은 과정이 필요하다. 물론 스토리북도 스토리 코드를 작성해야하는 귀찮음이 존재.. 2022. 11. 11.