제품군 · 장기 오너십
02 / 12
BiFi
단일 체인 lending 앱에서 크로스체인 lending, 레버리지 포지션, 분석, 장기 운영으로 확장한 제품군입니다.
- 역할
- Frontend Lead · Primary Frontend Owner
- 문제
- 제품이 여러 프론트엔드 세대로 발전하는 동안 트랜잭션의 의미를 일관되게 유지하고, 오래된 화면 상태가 잘못된 액션을 만들지 않게 하는 것이 가장 어려운 문제였습니다.
- 전략
- 제품 여정을 계정, 포지션, 트랜잭션, 연동 상태와 분리했습니다. 크로스 네트워크 액션은 현재 지갑, 네트워크, 자산, 금액, 포지션을 하나의 실행 맥락으로 묶고, 트랜잭션 한 건을 전체 결과로 보지 않은 채 브릿지, 컨트랙트, 포트폴리오 단계를 다시 조정합니다.
- 성과
- 초기 lending 애플리케이션에서 크로스체인 lending, 레버리지 포지션, 분석, governance 경험으로 BiFi를 확장했습니다.
01
문제 정의
왜 이 문제를 해결해야 했는가
BiFi는 자산 공급, 대출, 상환, 포지션 관리를 제공하며 시작했습니다. 이후 크로스체인 lending, 레버리지 포지션, 분석, governance, 공통 브릿지 기반으로 확장했습니다.
사용자와 시스템이 마주한 문제
초기 DeFi 사용자에게 지갑, 네트워크 선택, 승인, 공급, 대출, 상환, 출금은 익숙하지 않은 과정이었습니다.
포지션, 레버리지 전략, 분석, governance 자산, 시장, 실행 규칙이 여러 네트워크와 프론트엔드 세대로 확장됐습니다.
사용자가 보는 지갑·포지션 맥락과 실제 서명할 트랜잭션이 일치해야 했습니다.
프론트엔드 오너십
Core·Cross-chain BiFi, BiFi-X, Owly, governance, 브릿지, 공통 currency 시스템의 프론트엔드 대부분을 리드하고 책임졌습니다.
제품 세대를 아우르는 Vue·Next.js 애플리케이션 아키텍처
Lending, 레버리지 포지션, 분석, governance, staking, rewards, market, 크로스체인 경험
지갑, 자산, 네트워크, 브릿지, SDK, API, 컨트랙트 경계
트랜잭션 상태, 이력, 다국어, 관측성, E2E, 유지보수
02
해결 전략
프로덕션까지 이어지는 시스템 전략
제품 여정을 계정, 포지션, 트랜잭션, 연동 상태와 분리했습니다. 크로스 네트워크 액션은 현재 지갑, 네트워크, 자산, 금액, 포지션을 하나의 실행 맥락으로 묶고, 트랜잭션 한 건을 전체 결과로 보지 않은 채 브릿지, 컨트랙트, 포트폴리오 단계를 다시 조정합니다.
시스템 모델
Core lending과 Cross-chain BiFi가 계정·포지션 상태를 자산 조합, 브릿지, API, 컨트랙트, 포트폴리오 adapter와 연결하고 공통 기반이 지갑·자산 동작을 일관되게 유지합니다.
제품 화면
주요 제품 화면
과거 제품 인터페이스입니다. 화면의 수치는 캡처 당시 UI 상태이며 현재 TVL, APY 또는 성과를 의미하지 않습니다.



제품과 구현 구성
직접 책임진 일곱 개의 제품 표면
BiFi는 lending, 크로스체인 실행, 레버리지 포지션, 분석, governance, 공통 인프라를 거치며 발전했습니다. 최신 공개 세대인 Cross-chain BiFi를 가장 먼저 보여줍니다.
최신 제품 세대
Cross-chain BiFi
한 네트워크의 네이티브 자산을 공급하고 다른 네트워크에서 대출하면서 지갑, 브릿지, 컨트랙트, 포트폴리오 상태를 일치시키는 Next.js 프론트엔드입니다.
구현 상세 · 2
- 크로스 네트워크 자산 조합을 중심으로 공급, 출금, 대출, 상환, claim, market, rewards 경험을 구현했습니다.
- 지갑, 네트워크, 자산, 금액, 포지션이 바뀌면 오래된 실행 맥락을 무효화했습니다.
초기 제품 기반
Core BiFi 애플리케이션
초기 Vue 애플리케이션에서 supply, borrow, repay, withdrawal, pool, staking, rewards, market, 지갑, 멀티네트워크 포지션을 제공했습니다.
구현 상세 · 2
- 애플리케이션 아키텍처와 핵심 금융 흐름 대부분을 구현하고 운영했습니다.
- 계정, 네트워크, 포지션, 트랜잭션, 다국어, 이력 상태를 중앙화했습니다.
컨트랙트 운영 중 · 비공개 프론트엔드
BiFi-X
BiFi lending과 flash loan으로 레버리지 yield, long, short 포지션을 한 번의 트랜잭션에 만드는 제품입니다. 컨트랙트는 운영 중이며 프론트엔드는 비공개로 운영합니다.
구현 상세 · 2
- 전략 탐색, 위험 안내, 포지션 생성, 모니터링, 출금, rewards를 위한 Vue 프론트엔드를 구현하고 운영했습니다.
- 사용할 수 없는 공개 UI처럼 제시하지 않고 공개 컨트랙트 저장소만 연결합니다.
포지션 분석
Owly
레버리지 BiFi 포지션의 전략 탐색, 주소 기반 포지션 추적, 순위, P&L 분석을 제공했습니다.
구현 상세 · 2
- 활성·종료 포지션, 전략 카드, 기간별 성과를 중심으로 제품·분석 화면을 구현했습니다.
- Rewards, 이자, 자산, 포지션 데이터를 비교하고 내보낼 수 있게 만들었습니다.
토큰과 governance 운영
Governance 프론트엔드
gBiFi governance와 토큰 관리 액션을 지갑·컨트랙트 실행으로 연결하는 전용 프론트엔드입니다.
구현 상세 · 2
- Governance 관련 자산을 위한 제품 표면과 트랜잭션 흐름을 구현했습니다.
- 지갑, 체인, 컨트랙트 signature, 정책 호환성을 장기 유지했습니다.
지원 프론트엔드 시스템
브릿지와 공통 기반
전용 브릿지 흐름과 공통 currency 계층으로 제품군의 지갑, 토큰, 네트워크, 서명, 금액 동작을 일관되게 유지했습니다.
구현 상세 · 2
- 체인·토큰 설정을 재사용 가능한 상호작용·트랜잭션 단계와 분리했습니다.
- 브릿지 요청, 지갑 상태, 서명, 자산 의미를 명확한 연동 계층으로 처리했습니다.
제품 유지와 개선
장기 프로덕션 운영
제품군을 운영하며 프레임워크, 의존성, 지갑, API, RPC, 관측성, 개인정보, 보안을 지속해서 관리했습니다.
구현 상세 · 2
- 대체 경로, 오류 분류, 개인정보 제거, 지갑 확장 프로그램의 무관한 오류 필터링을 강화했습니다.
- 변화하는 네트워크와 브라우저 지갑, 프론트엔드 세대에 걸쳐 핵심 흐름을 유지했습니다.
주요 구현 결정
핵심 supply, withdrawal, borrow, repay, pool, staking, rewards, market, claim 흐름을 구현했습니다.
출발 네트워크의 자산 공급을 대상 네트워크의 대출과 포트폴리오 동기화까지 연결했습니다.
레버리지 전략, 위험, rewards, P&L을 중심으로 BiFi-X 포지션과 Owly 분석 경험을 구현했습니다.
현재 지갑, 네트워크, 자산, 금액, 포지션에서 실행 맥락을 만들고 오래된 상태는 제출 전에 무효화했습니다.
지갑, 브릿지, API, RPC, 컨트랙트, 트랜잭션, 포트폴리오 단계를 분리하고 Sentry 관측성과 대체 경로를 강화했습니다.
03
성과
무엇이 달라졌고 무엇을 배웠는가
초기 lending 애플리케이션에서 크로스체인 lending, 레버리지 포지션, 분석, governance 경험으로 BiFi를 확장했습니다.
여러 프론트엔드 세대와 장기 프로덕션 운영에 걸쳐 핵심 lending·rewards 경험을 유지했습니다.
이후 크로스체인, BTCFi, DEX, SDK 작업에 재사용되는 패턴을 만들었습니다.
배운 점
장기 제품 오너십에서는 오래된 상태, 마이그레이션, 연동 경계가 최초 구현만큼 중요합니다. 화면의 선택이 실행 데이터를 만든다면 이는 트랜잭션 무결성 문제입니다.
지금이라면
제품군을 typed feature module, 변경 불가능하고 schema로 검증되는 실행 snapshot, 명시적 크로스 네트워크 상태 머신, 원격 상태 query cache, 재현 가능한 지갑·API·RPC·컨트랙트·observer 테스트로 표준화하겠습니다.
함께 일하기