Turborepo + GitHub Actions CI 최적화하기
Turborepo Remote Cache와 GitHub Actions Matrix Strategy를 활용해 CI 빌드 시간을 단축한 과정을 공유해요.
Frontend Engineer 강민하입니다. 👋
무엇을 만들든 ‘왜’를 먼저 고민하며, 더 나은 방법을 찾아가는 과정을 즐깁니다.
지식과 경험을 나누며 동료와 함께 지속적으로 성장하고, 서로의 인사이트를 주고받는 과정을 중시해요.
다양한 오픈소스에 기여하며 커뮤니티와 함께 성장하고 있어요.
- • TanStack (query, form)
- • toss (suspensive, react-simplikit)
- • react-hook-form
Recent Posts
최근에 공유된 포스트들을 확인해보세요.
tsup에서 tsdown, 번들 크기 다이어트하기
tsup에서 tsdown으로 마이그레이션하며 번들 크기를 24% 감소시켰던 경험을 공유해요.
토스트 번들링과 테스트, CI/CD - React Compact Toast(2)
직접 만든 토스트 컴포넌트를 오픈소스 라이브러리로 만들었던 과정을 공유해요.
토스트 컴포넌트 구현기 - React Compact Toast(1)
EventManager 기반 토스트 시스템을 개발했던 경험을 공유해요.
generatePath를 활용해 타입 안전성과 DX 둘 다 잡기
react-router에서 동적 URL을 Type-Safe하게 생성하면서도, DX를 놓치지 않으려 했던 경험을 공유해요.
Turborepo + GitHub Actions CI 최적화하기
Turborepo Remote Cache와 GitHub Actions Matrix Strategy를 활용해 CI 빌드 시간을 단축한 과정을 공유해요.
tsup에서 tsdown, 번들 크기 다이어트하기
tsup에서 tsdown으로 마이그레이션하며 번들 크기를 24% 감소시켰던 경험을 공유해요.
토스트 번들링과 테스트, CI/CD - React Compact Toast(2)
직접 만든 토스트 컴포넌트를 오픈소스 라이브러리로 만들었던 과정을 공유해요.
토스트 컴포넌트 구현기 - React Compact Toast(1)
EventManager 기반 토스트 시스템을 개발했던 경험을 공유해요.
generatePath를 활용해 타입 안전성과 DX 둘 다 잡기
react-router에서 동적 URL을 Type-Safe하게 생성하면서도, DX를 놓치지 않으려 했던 경험을 공유해요.
Turborepo + GitHub Actions CI 최적화하기
Turborepo Remote Cache와 GitHub Actions Matrix Strategy를 활용해 CI 빌드 시간을 단축한 과정을 공유해요.
tsup에서 tsdown, 번들 크기 다이어트하기
tsup에서 tsdown으로 마이그레이션하며 번들 크기를 24% 감소시켰던 경험을 공유해요.
토스트 번들링과 테스트, CI/CD - React Compact Toast(2)
직접 만든 토스트 컴포넌트를 오픈소스 라이브러리로 만들었던 과정을 공유해요.
토스트 컴포넌트 구현기 - React Compact Toast(1)
EventManager 기반 토스트 시스템을 개발했던 경험을 공유해요.
generatePath를 활용해 타입 안전성과 DX 둘 다 잡기
react-router에서 동적 URL을 Type-Safe하게 생성하면서도, DX를 놓치지 않으려 했던 경험을 공유해요.
Turborepo + GitHub Actions CI 최적화하기
Turborepo Remote Cache와 GitHub Actions Matrix Strategy를 활용해 CI 빌드 시간을 단축한 과정을 공유해요.
tsup에서 tsdown, 번들 크기 다이어트하기
tsup에서 tsdown으로 마이그레이션하며 번들 크기를 24% 감소시켰던 경험을 공유해요.
토스트 번들링과 테스트, CI/CD - React Compact Toast(2)
직접 만든 토스트 컴포넌트를 오픈소스 라이브러리로 만들었던 과정을 공유해요.
토스트 컴포넌트 구현기 - React Compact Toast(1)
EventManager 기반 토스트 시스템을 개발했던 경험을 공유해요.
generatePath를 활용해 타입 안전성과 DX 둘 다 잡기
react-router에서 동적 URL을 Type-Safe하게 생성하면서도, DX를 놓치지 않으려 했던 경험을 공유해요.
useSuspenseQueries로 request waterfall 현상 해결하기
request waterfall 현상을 해결하며, 홈 페이지 진입속도를 약 73% 단축시킨 경험을 공유해요.
모노레포 세팅부터 도메인 아키텍처까지(Turborepo + Pnpm)
confeti 프로젝트의 모노레포 도입 과정과 패키지 매니저 선택과정, 폴더구조를 공유해요.
Protected Route로 라우트 보호하기
Protected Route로 인증이 필요한 페이지를 보호하는 방법에 대해서 작성했어요.
Object.freeze() vs Object.seal()
Object.freeze()와 Object.seal()의 차이점과 사용 방법 그리고 deepFreeze 구현 방법에 대해서 작성했어요.
웹 접근성 향상을 위한 rem
왜 px대신 rem이 권장되는지에 대해서 작성했어요.
useSuspenseQueries로 request waterfall 현상 해결하기
request waterfall 현상을 해결하며, 홈 페이지 진입속도를 약 73% 단축시킨 경험을 공유해요.
모노레포 세팅부터 도메인 아키텍처까지(Turborepo + Pnpm)
confeti 프로젝트의 모노레포 도입 과정과 패키지 매니저 선택과정, 폴더구조를 공유해요.
Protected Route로 라우트 보호하기
Protected Route로 인증이 필요한 페이지를 보호하는 방법에 대해서 작성했어요.
Object.freeze() vs Object.seal()
Object.freeze()와 Object.seal()의 차이점과 사용 방법 그리고 deepFreeze 구현 방법에 대해서 작성했어요.
웹 접근성 향상을 위한 rem
왜 px대신 rem이 권장되는지에 대해서 작성했어요.
useSuspenseQueries로 request waterfall 현상 해결하기
request waterfall 현상을 해결하며, 홈 페이지 진입속도를 약 73% 단축시킨 경험을 공유해요.
모노레포 세팅부터 도메인 아키텍처까지(Turborepo + Pnpm)
confeti 프로젝트의 모노레포 도입 과정과 패키지 매니저 선택과정, 폴더구조를 공유해요.
Protected Route로 라우트 보호하기
Protected Route로 인증이 필요한 페이지를 보호하는 방법에 대해서 작성했어요.
Object.freeze() vs Object.seal()
Object.freeze()와 Object.seal()의 차이점과 사용 방법 그리고 deepFreeze 구현 방법에 대해서 작성했어요.
웹 접근성 향상을 위한 rem
왜 px대신 rem이 권장되는지에 대해서 작성했어요.
useSuspenseQueries로 request waterfall 현상 해결하기
request waterfall 현상을 해결하며, 홈 페이지 진입속도를 약 73% 단축시킨 경험을 공유해요.
모노레포 세팅부터 도메인 아키텍처까지(Turborepo + Pnpm)
confeti 프로젝트의 모노레포 도입 과정과 패키지 매니저 선택과정, 폴더구조를 공유해요.
Protected Route로 라우트 보호하기
Protected Route로 인증이 필요한 페이지를 보호하는 방법에 대해서 작성했어요.
Object.freeze() vs Object.seal()
Object.freeze()와 Object.seal()의 차이점과 사용 방법 그리고 deepFreeze 구현 방법에 대해서 작성했어요.
웹 접근성 향상을 위한 rem
왜 px대신 rem이 권장되는지에 대해서 작성했어요.