프로젝트 2

[Vite/디자인시스템] React / NextJS 빌드 테스트 삽질 여정기..

요즘 부트캠프에서의 디자인 시스템 프로젝트 개발 작업 스퍼트가 시작돼서 정신 없이 작업 중이다. 그 중 내가 궁금했던 부분이기도 했고 잘 몰랐던 부분에 대해 삽질한 여정을 기록하고자 포스팅을 남긴다. Woori Design System의 목표안정성호환성보안성원래 목표는 우리 금융 그룹에서 (혹시나 하는 마음으로...) 우리가 제대로 만들면 디자인 시스템을 인수해서 사용해주지 않을까 하는 설레발로 프로젝트를 시작했다. 금융권에서의 기본은 보안이기에, 우리 디자인 시스템에서는 각종 라이브러리들의 의존성을 다 끊어내고 독립적인 디자인 시스템을 만들고자 하였다. (우리 금융 그룹 내에 이미 디자인 시스템을 만들고 있다는 걸 현직자 분을 통해 알게 되어서.. 설레발은 이렇게 끝이 났지만...) 타겟을 우리FIS..

프로젝트 2025.04.12

[React/디자인시스템] 선언적으로 Snackbar 구현하기

교내 개발 동아리 디자인 시스템의 Snackbar 컴포넌트 개발을 진행하면서 고민하고 개선해나간 과정에 대해 정리하고자 한다. 처음에 작성했던 Snackbar 코드다.처음 코드를 작성했을 때 정말.. 잘못 설계했다는 것을 깨달았다. 이유는 다음과 같다.import { useCallback, useEffect, useRef, useState } from 'react';import { IcAlertTriangleFilled, IcCloseFilled } from '@/style';import { StyledErrorIc, StyledIcMessage, StyledMessage, StyledSnackbar } from './Snackbar.style';import { SnackbarHeightType, Sna..

프로젝트 2025.02.16