Cosmostation 크롬 익스텐션
멀티체인 지갑 — 토큰 검색 페이지 · 체인 추가
Role: 프론트엔드 개발 인턴 (토큰 검색 · 체인 추가)
Overview
Cosmos·Ethereum 등 여러 체인을 지원하는 오픈소스 크롬 익스텐션 지갑입니다. 인턴으로 참여해 티켓 단위로 기능을 맡았고, 신규 체인(Kujira) 추가와 토큰 검색 페이지 제작을 담당했습니다. 여기서 처음으로 '동작하는 코드'와 '리뷰를 통과하는 코드'가 다르다는 걸 체감했습니다 — 같은 기능을 리뷰 코멘트에 따라 여러 번 다시 올렸고, 그 과정에서 디바운스 처리와 상태 흐름을 손보며 검색 입력의 반응을 개선했습니다.
이 프로젝트의 핵심
Kujira 체인 추가
체인 상수·심볼 에셋·체인 목록 등록까지 신규 체인 온보딩 전 과정
이더리움 ERC20 토큰 리스트·검색 페이지 제작
entry/layout/styled 구조와 TokenItem 컴포넌트 구성
Cosmos CW20 토큰 검색 페이지
특정 체인 전용에서 전 체인 지원으로 확장
검색 입력에 디바운스 도입
입력마다 발생하던 조회를 줄이고, 직접 만든 로직을 공통 useDebounce 훅으로 정리
나머지 2개 더 보기접기
코드 리뷰 반영을 전제로 한 개발
같은 기능을 리뷰 코멘트에 따라 반복해 다시 올림
한국어·영어 번역 리소스 추가
신규 화면의 i18n 대응
자세히
체인 · 토큰 기능4
Kujira 체인을 익스텐션에 추가
체인 정의 상수, 체인 목록 등록, 심볼 이미지까지 함께 반영
이더리움 ERC20 토큰 리스트 페이지 제작
검색 화면 구조(entry·layout·styled)와 개별 토큰 아이템 컴포넌트를 나눠 구성
Cosmos CW20 토큰 검색 화면을 만들고, 처음 특정 체인 대상이던 것을 전 체인 지원으로 확장
라우트 상수와 라우터에 새 화면을 연결하고, 지갑 화면의 토큰·코인 목록과 이어지게 함
성능과 리뷰4
검색 입력에 디바운스를 적용하고 useCallback으로 감싸 불필요한 조회와 재생성을 줄임
직접 만든 디바운스 로직을 이후 공통 useDebounce 훅으로 정리
리뷰 코멘트를 반영한 커밋이 여러 차례
조건 판단 로직 단순화, 불필요한 로그·주석 제거, 스타일 정리
신규 화면에 맞춰 한국어·영어 번역 리소스를 함께 추가