Figma를 원본으로 하는 React 디자인 시스템이에요. 토큰, Core 컴포넌트, AI가 읽는 디자인 규칙을 npm 패키지 하나로 배포해요.
- React
- TypeScript
- Vite
- Tailwind CSS
- Vitest
Side Projects
디자인 시스템 Sonic UI로 만든 사이드 프로젝트예요. 같은 토큰과 컴포넌트로 만들어서, 쓰다가 막힌 곳은 Sonic UI를 고치는 근거가 돼요.
React + TypeScript 코딩 규칙을 글이 아니라 도구로 지키게 하는 Claude Code 플러그인이에요.
- Claude Code
- ESLint
- Prettier
- TypeScript
- Node.js
Sonic UI의 토큰, 컴포넌트, 가이드라인, 화면 사례를 소개하는 이 사이트예요. sonic-ui를 실제로 쓰는 첫 프로젝트예요.
- Next.js
- React
- TypeScript
- Tailwind CSS
- TanStack Query