테크톡톡 2026 | Frontend Developer - 우당탕탕 디자인 시스템
토스증권 Tech Talk Talk 토스 · YouTube
AI 핵심 요약
토스증권 디자인 시스템 팀은 초기 단계의 라이브러리를 운영하며 버전 관리, 컴포넌트 확장, 아이콘 크기 보정 문제를 팀의 실제 사용 방식에 맞춰 풀었습니다. 사용처가 제한적이고 팀이 제품 업데이트까지 맡는 상황을 고려해 SemVer와 Changesets 대신 날짜 기반 버전을 도입하고, AI 에이전트가 PR을 바탕으로 릴리즈 노트를 작성하도록 했습니다. 컴포넌트에는 의도된 props를 기본으로 제공하면서 추가 DOM 속성은 커스텀 props와 슬롯으로 다루고, 아이콘 여백 보정은 리소스 센터 라이브러리로 옮겨 관심사를 분리했습니다. 세 가지 사례는 보편적인 정답보다 팀의 운영 환경에 맞는 설계를 선택하고, 그에 따른 단점도 함께 관리하는 것이 중요하다는 점을 보여줍니다.
- 라이브러리 사용처가 적고 업데이트를 만드는 팀이 직접 반영한다면, SemVer와 Changesets의 이점이 줄어드는지 점검해 보세요.
- 날짜 기반 버전은 자동화하기 쉽지만 변경 내역을 찾기 어려울 수 있으므로, PR을 바탕으로 릴리즈 노트를 생성하는 방법을 함께 고려할 수 있습니다.
- 컴포넌트의 기본 props는 의도한 API로 제한하고, 추가 DOM 속성은 이름이 명확한 커스텀 슬롯으로 열어 두면 확장성과 사용 의도를 함께 관리할 수 있습니다.
- 시각적 차이를 보정하는 로직은 그 차이를 만들어 내는 시스템에 두어야 컴포넌트의 조건 분기가 늘어나는 것을 막을 수 있습니다.
소개
토스증권 Design System Team의 미션은 '제품 메이커들이 높은 퀄리티의 UX를 빠르게 구현할 수 있는 환경을 만드는 것'이에요. 디자인 시스템을 운영하며, ‘우리 팀의 현재 상황’에 최적화된 방식으로 문제를 풀어낸 세 가지 에피소드를 공유할게요. 박건영 | 토스증권 Frontend UX Engineer 토스증권 프론트엔드 챕터에 합류하고 싶다면 👉 https://toss.im/career/jobs?search=프론트엔드집중채용
비슷한 학습 자료
컨퍼런스 토스증권 Tech Talk Talk
테크톡톡 2026 | ML Engineer - AI에게 투자정보를 말하게 하기까지
컨퍼런스 토스증권 Tech Talk Talk
테크톡톡 2026 | ML Engineer - 토스증권 추천과 검색은 어떻게 진화하고 있을까?
컨퍼런스 토스증권 Tech Talk Talk
테크톡톡 2026 | ML Engineer - LLM 서빙, 띄우는 것과 잘 띄우는 것 사이
컨퍼런스 토스증권 Tech Talk Talk
테크톡톡 2026 | Frontend Developer - 토스증권 AI 개발로 배운 실전 인터랙션 팁
컨퍼런스 토스증권 Tech Talk Talk
테크톡톡 2026 | Frontend Developer - 토스증권 FE 인프라 전반
컨퍼런스 토스증권 Tech Talk Talk
토스증권 Client Platform Team은 수많은 유저에게 정적 자원을 신속하고 안정적으로 전달하기 위해 고도화된 인프라를 구축해 배포하고 있어요. CloudFront + Lambda@Edge 기반의 배포부터 마이크로 프론트엔드(MFA), 그리고 AI를 활용한 생산성 혁신까지! 토스증권 FE 인프라의 핵심 전략을 공개해요. 장재영 | 토스증권 Client Platform Team Leader 토스증권 프론트엔드 챕터에 합류하고 싶다면 👉 https://toss.im/career/jobs?search=프론트엔드집중채용
프론트엔드 데브옵스 · 인프라
컨퍼런스 채널데브톡 2025