안녕하세요. TypeScript 프론트엔드용 빌드 타임 DI 라이브러리 prewire를 만들었습니다. 이 라이브러리를 만들게 된 계기는 제가 관리하는 프론트엔드 모노레포의 구조였습니다. 여러 사업의 프론트엔드가 하나의 core/kit 코드를 공유하고 있는데, 현재 앱들은 Next.js를 사용하고 있습니다. 앞으로 일부 사업에서는 TanStack Router를 사용해 보고 싶었지만, 그렇다고 공유 코어가 next/navigation이나 @tanstack/react-router에 직접 의존하게 만들고 싶지는 않았습니다. 사업마다 다른 구현을 선택하면서도 공유 코어는 수정하지 않는 구조가 필요했습니다. prewire에서는 공유 코드가 먼저 port와 token을 선언합니다. export interface RouterPort { href(to: string): string push(to: string): void } export const ROUTER = new InjectionToken<RouterPort>('router') 각 앱은 자신이 사용하는 프레임워크로 이 port를 구현합니다. export const tanstackRouter = injectable( { logger: LOGGER }, ({ logger }): RouterPort => ({ href: (to) => to, push: (to) => { logger.info(`navigate → ${to}`) throw redirect({ to }) }, }), { provides: ROUTER }, ) 공유 코드를 포함한 소비자 쪽에서는 구현이 어디서 왔는지 알 필요 없이 같은 경로만 import합니다. import { router } from '#prewire' prewire codegen이 앱과 공유 패키지의 injectable() 선언을 정적으로 분석해 의존성 순서대로 평범한 TypeScript composition root를 생성합니다. export const logger = consoleLoggerBinding.factory({}) export const router = tanstackRouterBinding.factory({ logger }) 런타임 컨테이너나 reflect-metadata, decorator는 사용하지 않습니다. 누락된 binding, 순환 의존성, 중복 binding 같은 문제는 실행 중이 아니라 코...
Show GN: prewire - 런타임 컨테이너 없이 빌드 타임에 연결하는 TypeScript 프론트엔드 DI
1 week ago
15
Related
한 연구자가 noreply.net을 샀더니 기업 기밀이 쏟아짐
1 hour ago
1
프랑스, 사전 동의 없는 텔레마케팅 전화 금지
1 hour ago
0
GitHub Actions에 OIDC audience 제약이 필요한 이유
3 hours ago
0
H3-metal - Apple Silicon용 네이티브 MiniMax-H3 추론
3 hours ago
1
AI가 웹을 잠식하면서 인터넷의 집단 기억이 사라지고 있음
4 hours ago
1
Rails는 DHH 없이도 Rails일 수 있을까
6 hours ago
1
LLM은 PCB 배선을 어디까지 할 수 있을까? 숙련자와 Net 단위로 비교해봤습니다
6 hours ago
1
Hanami - Rails를 대체하는 Ruby 프레임워크
7 hours ago
2
Tips
click
Popular
What's New in SAP S/4HANA Cloud Public Edition 2608 | Releas...
3 weeks ago
209
Codex 사용량 한도 리셋 추적
3 weeks ago
88
NVIDIA·CoreWeave·Nebius가 만든 GPU 붐의 순환 금융 구조
4 weeks ago
62
'킬러들의 쇼핑몰2' 감독 "시즌3 고민 중"⋯이동욱 "시키면 ...
3 weeks ago
57
© Clint IT 2026. All rights are reserved









English (US) ·