1. 계기
기존에 만들던 디자인 시스템은 개인 공부가 주 목적이었다. 하지만 다른 사람들이 사용한다고 했을 때도 무리가 없을 정도로 퀄리티를 지켜가며 개발하려고 노력했다
하지만 개발하면서 일관성이 많이 안 지켜지는 것 같았다
예를 들어서 컴포넌트에서 React hook이나 타입을 쓴다고 하면
어디서는 필요한 것만 import하고, 어디서는 React.useState 으로 사용하고...
파일명 또한 어디는 각 합성 컴포넌트를 하나의 파일에 작성하고, 어디서는 각각 파일로 나누고..
git 관리 또한 너무 안되고 있었다
커밋명도 영어,한글을 번갈아가며 쓰고, pr도 정리가 안되고
코드에는 신경을 썼지만, 그 밖의 것에는 '나중에 한번 정리해야지' 하고 신경을 못 쓰고 있었다
- 나는 뭔가 이런 통일되지 않은 시스템을 잘 못 견디는 것 같다
두번째로는 headless UI를 어디까지 headless하게 만들 것인지를 정하는 것이 어려웠다.
예를 들어서 아코디언을 만든다고 했을 때, 내가 사용할 목적이라면 아코디언의 open상태를 나타내는 아이콘을 내가 fix해놓고 사용하는 것이 좋을 것이고, 다른 사람이 사용할려면 이 부분도 외부에서 주입받게 해야 한다.
사실 어떤 방법이던 정하기만 하면 된다. 하지만 혼자 개발하다 보니 피드백을 받기가 어렵다 보니 생각이 오늘 다르고 내일 다르고 하다보니 중구난방이 되어가고 있다는 생각이 들었다
2. 취업
10월부터 자소서를 준비해서 약 2달 간 취준을 도전해봤지만, 결국 마음에 드는 기업에 가는 건 성공하지 못했다
=> 시간이 남는다
또한 면접을 보면서 느낀 점은 해당 주제 자체는 나쁘지 않은 것 같았다. 정말 힘들게 만들었기 때문에 할 이야기도 많고 이론적으로 배운 부분도 많다.
하지만 아직 이 디자인 시스템으로 유의미한 무언가를 달성해보지 않아서 그래서 이걸로 뭘 했는데? 라는 질문에 증명할 수가 없다
- 물론 내 라이브러리를 남들이 사용해줄 거란 보장은 없다..
3. 공부
디자인 시스템을 만들고자 했을때 주변에서나, 개인적으로도 취준생의 입장에서 개발이 아닌 디자인에 대해서 고민하는 게 의미가 있을까? 라는 생각이 들었다
하지만 정작 디자인에 대한 건 5%도 고민한 적이 없는 것 같다..
일단 가장 많이 배울 수 있는건 UI의 구현력이었다
기본 native html을 사용해서 개발할지, 아니면 직접 새롭게 기능을 만들지
리액트로 개발할 경우 리액트만의 렌더링 흐름, 이벤트 처리로 인해 달라지는 부분이 있는지
접근성이라는 게 무엇이고, 이를 위한 처리를 어떻게 해야하는지
각 브라우저마다 어떤 기본값이 있고 어떻게 달라지는지
이 밖에도 번들링, 패키지 배포, 모노레포 관리 등등 다양한 부분을 배웠고, 이를 위해 다양한 라이브러리들을 참고했다. 인기 많은 라이브러리들부터 해서, 개인 repo까지 다 뒤져가면서 배운 점이 많은데,
사이드 프로젝트 라는 걸 굳이 어떤 서비스를 만드는 것만이 사이드 프로젝트일까? 라는 생각을 하게 되었다.
내가 부족한 점, 나에게 불편한 걸 채워 나가는 것도 사이드 프로젝트일텐데, 라이브러리를 만들면서 하는 것도 사이드 프로젝트가 아닐까 라는 생각을 하게 되었다
그래서 라이브러리로 만들면서 다른 사람들이 사용할 수 있게, 사용하기 편하게 만드는 그 과정 자체도 나에게 많은 도움이 되고, 새로운 공부가 될 것 같다는 생각이 들었다.
4. 이후 과정
일단은 다른 사람들이 사용할 수 있는 그런 라이브러리를 만드는 것이 목표이다
이제는 공부 목적이라기 보다는, 빠르고 안정성 있는 기능이 보장되어야 한다.
그래서 정말 슬프지만.. 지금까지 내가 만들었던 UI나 hook들은 잠시 치우고 radix UI 등등 잘 만든 headless UI를 사용해보려 한다
지금까지는 개판이었던 repo를 정리하고, 모노레포 구성에 공을 들였다.
설치만 해놨던 turborepo를 활용해서 CI/CD를 구성하고 커밋,pr 같은 경우에도 체계적으로 관리하기 위해서 여러 시스템을 도입했다.
새롭게 도전하는 핵심 기능은 CLI이다.
shadcn처럼 CLI를 통해 컴포넌트 코드 자체를 유저에게 넘겨줄 수 있는 그런 기능을 만들어 보려고 한다.
기존에도 컴포넌트 복사 기능을 구현하긴 했지만, shadcn 코드를 보면서 유저에게 최소한의 입력만 받기 위해서 매우 많은 부분을 알아서 처리하고 있다는 것을 알게 되었다.
어떻게 보면 유저가 일반 소비자 -> 개발자로 바뀌었다고도 볼 수 있을것 같다..
