RESUME

진유림 (Yurim Jalynne Jin)

Product oriented front-end engineer

프론트엔드 개발자 진유림입니다.

작은 목적조직에서 1인의 프론트엔드 개발자로서 민첩하게 움직인 경험 (2020.05 토스보험파트너),
중간 규모 조직에서 6인의 프론트엔드 그룹 리드로서 하나의 도메인을 일궈나간 경험(2022.04 토스모바일),
큰 규모 조직에서 여러 B2B 도메인이 하나의 앱처럼 유기적으로 움직일 수 있는 플랫폼을 다진 경험(2024.05 토스비즈니스)이 있습니다.

팀으로서 일궈내는 성취와, 팀원으로서 얻는 행복에 관심이 있습니다.
이를 위해 코칭을 공부하고, 1:1미팅 포맷을 지속적으로 개선해 나가며, 사내 프론트엔드 개발자들의 성장을 지원하는 다양한 프로그램을 고안합니다(사내/사외 기술토론 커뮤니티 - 프론트엔드다이빙클럽, 역량 지표, 코드스멜 위키 오픈소스).

어떻게든 즐겁게 일하기 위해 머리를 굴립니다.

현재 비바리퍼블리카(토스)에서 Frontend agile lead로 일하고 있습니다.

  • jayjinjay@gmail.com
  • https://github.com/milooy
  • https://twitter.com/jayjinjay

경력

  • Frontend Lead
    2023.07 - Present
  • Frontend Engineer
    2020.03 - 2023-06
Zepl2년 1개월
  • Frontend Engineer
    2018.02 - 2020-02
  • Software Engineer and UI Designer
    2015.06 - 2017-12
  • (Internship) Frontend Engineer
    2015.01 - 2015-06
  • (Internship) UI Designer
    2014.01 - 2014-02

프로젝트

Viva Republica (Toss)

[기술 리더십] 여러 팀을 넘나들며 조율하는 도메인의 기술적 리드
chevron

다양한 팀과의 협업을 통한 기술적 의사결정

  • 회원 시스템 전수조사: 다양한 회원 시스템 코드를 전수조사해 규칙을 세워 여러 계열사에서도 쉽게 적용할 수 있도록 SDK 형태로 배포
  • 주요 팀 프론트엔드 개발자들과의 협업 조율: 여러 팀(예: 토스 광고, 토스 쇼핑팀)과 협업하여 코드 리뷰 및 기술적 방향성 조율, 각 팀의 요구사항을 반영해 통합된 기술 솔루션 제시
  • 글로벌 네비게이션 설계: 모든 서비스에서 동일한 글로벌 네비게이션을 추가 배포 없이 제공할 수 있도록 Module Federation 방식으로 설계.

데스크탑 플랫폼의 기술적 문제 해결 주도

  • 데스크탑 플랫폼 통합: 기존 B2B 데스크탑 서비스를 통합하는 과정에서 각 도메인의 파편화된 환경을 개선. 이를 위해 F-lead, FE 플랫폼 엔지니어, FE 헤드와 함께 'Desktop Platform' 회의를 주도하고 통합 방향성 제시
  • Browser ID 표준화: 유저가 데스크탑 서비스 간 이동 시 발생하는 식별 ID 유실 문제를 해결하기 위해, 범용적으로 사용할 수 있는 Browser ID 표준을 제안. 이 표준을 수립하기 위해 데이터 분석가 및 DevOps 팀과 협력하여 공식 채널 생성 및 실행 계획 수립

팀과 조직을 아우르는 피드백 수집 및 반영

  • 도메인 기대사항 반영: 도메인 리더들과 정기적으로 소통하며 협업 피드백을 수집. 이후 협업 방식과 기술 전략을 조정하여 다음 학기 목표에 맞춰 개인의 목표와 프론트엔드 팀의 목표를 조율
  • 팀 코칭 및 성장 지원: 프론트엔드 직군뿐만 아니라 디자이너, iOS 개발자, 컬쳐팀과 함께 '팀 코칭' 스터디를 진행. 각 직군의 성장과 협업을 촉진하기 위한 실질적인 전략을 제안하고 실행
[팀 성장] 부드러운 리더십을 통한 구성원 발전 및 회사 목표와의 조화
chevron

캐주얼한 분위기의 기술적 성장 유도

  • 문제 해결을 위한 집단지성 도구 설계: 코드스멜 아카이브 슬랙 채널, 익명 커피챗 봇, 진행자 로테이션을 통한 엔지니어링 데이 등 구성원들이 쉽고 재미있게 참여할 수 있는 도구 설계

실사례 기반 커리어 코칭

  • 성과와 영향력의 문서화: Brag Document 템플릿을 통해 개인의 성과를 기록하고, 1:1 미팅에서 실사례 기반의 코칭 제공
  • 영향력 증진 워크샵: 스킬트리 템플릿을 1:1 미팅에서 함께 작성하고, 위클리 미팅에서 사례를 팀과 함께 찾아보며 기술적 영향력을 키우는 목표 설정

조직 개편 중 심리적 안정감 및 프로덕트 안정성 유지

  • 소통과 라포 형성: 조직 개편 시 1:1 및 팀 회의를 통해 구성원의 궁금증을 해소하고, 심리적 안정감을 유지할 수 있는 환경 조성.
  • 유지보수 체계 지원: 개발자 인원 축소 후에도 효율적 유지보수가 가능하도록 Zero-Ops 프로젝트 지원 및 주기적 미팅 수립.
[채용 및 브랜딩] 채용 및 브랜딩을 위한 퍼블릭 스피킹에서 가장 먼저 찾는 개발자
chevron

시니어 개발자 채용을 위한 커뮤니티 기반 팬덤 형성

  • 프론트 챕터에 시니어 지원자 부족 해결: 시니어 지원자가 부족하다는 문제를 해결하기 위해 대외 커뮤니티를 기획하여 운영.
  • 오피스 방문 프로그램: 격월로 50명의 중/시니어 프론트엔드 개발자들이 오피스를 방문해 개발 문화를 체험하고 친밀감을 형성하도록 유도.
  • 높은 전환율 달성: 매 모임 중 대략 참여자 30명 중 15명이 채용팀과의 커피챗을 신청하며 높은 전환율을 기록.

아티클과 영상 콘텐츠로 프론트 챕터의 기술 홍보 및 채용 인입 증대

  • 기술 홍보 아티클 및 영상 출연: '프론트엔드 챕터 리드'로서 토스테크 아티클 인터뷰와 '모닥불' 1화 영상에 출연(조회수 3.7천)하여, 저비용으로 채용 브랜딩 강화.
  • 지속적인 채용 인입 생성: 슬래시 발표영상 2개를 통해 꾸준히 채용 리드 생성. 지원자들이 개인 이메일 및 채용 인터뷰에서 영상을 언급하며, 채용 인입에 기여.

직군을 넘나드는 퍼블릭 스피킹 활동

  • 전 직군이 모이는 사내 행사 MC: 2024년 1학기 코어 얼라인먼트 위크에 MC로 참여해 개발자 베이스의 사회를 진행, 다양한 직군과의 소통을 이끌어냄.
[문제 해결] 장애의 근본적인 차단과 CS 감소를 위한 액션 플랜
chevron

QA 자동화를 통한 금액 오노출 방지 및 테스트 비용 절감

  • 자동화 스크린샷 도입을 통한 수기테스트 효율화: - 스크린샷 자동 전송: 주요 페이지의 스크린샷을 슬랙봇으로 전송해 테스트 리소스를 60분에서 5분으로 감소.
  • 금액 검사 자동화: 가격 오류를 방지하기 위해 자동화 테스트를 도입해 가격이 잘못된 코드는 배포가 불가하도록 설정
  • QA팀과 협업: QA팀과 협력하여 코드 오너십을 공유하며, 자동화 스크린샷 및 End-to-end 테스트 도입

사일로, 전사 OKR인 VoC 감소를 위해 QA, CX DRI를 프론트팀으로 이관

  • VoC 감소 목표 달성: 플랫폼팀의 안정성 강화를 위해 CX, QA의 DRI를 프론트팀으로 이관해 VoC 감소 목표 달성. "CX, QA를 온전히 맡아주고 있어 든든하다"는 피드백을 받음.
  • 정규화된 데이터 기반 개선: CS 데이터를 카테고리화하고, VoC 자동 분류 시스템 구축. 데이터를 시각화하여 개선 효과를 정량적으로 측정.

테스트를 하기 위한 인간 의존성 제거(서버개발자 의존, 프론트개발자 의존)

  • 서버개발자 의존 없는 로컬테스트 환경 구축: 서버 개발자 도움 없이 프론트에서 다양한 사용자 케이스를 테스트할 수 있는 환경을 MSW(Mock Service Worker)를 활용해 구축.
  • 프론트개발자 의존 없는 알파테스트 환경 구축: PO나 PD가 개발자 도움 없이도 직접 다양한 케이스를 확인할 수 있는 Admin 구성. 서비스 완성도와 테스트 시간 개선.
[서비스 개발] 토스비즈니스 플랫폼 구축
chevron

서비스 소개

  • 주소: https://business.toss.im/
  • 기간: 2024.02 ~ 현재
  • 비즈니스 목표: 토스 내 여러 B2B 도메인(광고, 쇼핑, 페이 등)이 하나의 앱처럼 유기적으로 움직일 수 있는 플랫폼 생성
  • 사용 기술: React(CSR 환경)

주요 도전 과제

1. 회원 체계 대통합 (OAuth)
  • Cookie, JWT 등 각자의 스펙으로 각자의 도메인에서 운영하던 회원 체계를 OAuth로 단일화 (하나의 사이트로 리디렉션해 가입/로그인하는 방식) 및 여러 도메인 개발자와의 협업
  • 한 번의 가입으로 토스 내의 여러 B2B 서비스를 이용할 수 있는 마이그레이션 플로우 설계 및 개발
  • 서비스를 넘나드는 QA 프로세스 구축 (조건에 맞는 회원정보 DB화, 템플릿 수립)

2. 로그 표준 논의 주도
  • 유저가 데스크탑 서비스간에 이동시 식별ID 유실 문제를 인지하고 범-서비스간 보존되는 Browser ID 표준을 만들기 위해 타 도메인의 F-lead, Data Analyst, DataOps Manager와 회의를 진행하여 행동 계획 수립 및 공식 채널 생성

3. 에러 민감도를 높여 서비스 안정화 및 디버깅이 용이한 환경 구축
  • 통합 서비스를 개발하니 이 서비스가 장애가 난다면 관련된 모든 팀에게 영향을 미치는 강결합이 생김
  • 전반적인 피드백 채널과 최대한 빠르게 확인해야 하는 에러 제보 채널을 분리해 후자 채널은 모든 메세지가 이슈트래커 티켓으로 만들어지고, 주요 팀원들을 자동으로 멘션하도록 셋업
  • 고객-CX-개발자 핑퐁을 줄이기 위해 디버깅에 필요한 정보를 고객에게 미리 받아 CX가 개발자에게 전달하는 솔루션 개발 및 프로세스 수립
[서비스 개발] 토스모바일 서비스 구축 및 유지보수
chevron

서비스 소개

  • 주소: https://tossmobile.co.kr/
  • 기간: 2022.04 ~ 2024.02
  • 비즈니스 목표: 인수한 알뜰폰 통신사를 통해 토스모바일 사업을 혁신적으로 이끌어내는 것
  • 사용 기술: React(Next.js를 사용한 SSR 환경), 모바일 웹앱
[서비스 개발] 보험 서비스 유지보수 및 토스보험파트너 서비스 구축
chevron

서비스 소개

  • 주소: https://blog.toss.im/article/toss-insurance-partner
  • 기간: 2020.02 ~ 2022.03
  • 비즈니스 목표: 온라인화가 상대적으로 부족한 보험 업계를 스크래핑, 마이데이터를 활용해 혁신
  • 사용 기술: React(Next.js를 사용한 SSR 환경), 모바일 웹앱

Zepl

[서비스 개발] 데이터 사이언티스트 대상 리액트 웹 애플리케이션 리뉴얼 및 유지보수
chevron
  • 실시간 협업 및 데이터 시각화 기능이 포함된 데이터 사이언티스트용 React 웹 애플리케이션 개발
  • 디자이너와 함께 정립한 디자인 가이드라인으로 프런트엔드 UI 컴포넌트 설계 및 구축. UI 컴포넌트 문서화를 위한 Storybook 제작

Overall app behavior

Carousel, Dropdown with Skeleton loading indicator

Modal with searchable dropdown components

Filterable/Sortable/Searchable Table with Pin feature

Item box and Overlay with micro interactions

Collapsible with Real-time Graphs and Table

Outline sidebar with search feature

Code snippets

[오픈소스 컨트리뷰션] Apache Zeppelin 코드 리뷰 및 개선 작업 참여
[시스템 구축] 사용자 데이터 분석 및 자동화 테스트 시스템 구축
chevron
  • 데이터 기반 UI, UX 설계를 위한 사용자 데이터 분석 시스템 구축 - Google Analytics, Pendo - 테스트 자동화를 위한 단위 테스트, E2E 테스트 케이스 작성, Jest, Enzyme, Cypress, React Testing Library

The Pinkfong Company

[서비스 개발] 핑크퐁 스토어 E-commerce 사이트 UI 디자인, 서버, 프론트엔드 개발
chevron

핑크퐁 스토어 e-commerce 사이트 UI 디자인 설계 & 개발 및 Django를 이용한 백엔드 서비스 구축

[시스템 구축] 재고 관리 시스템 제작 및 PWA 기반 푸시 알림 시스템 구축
chevron
  • Angular를 이용한 SPA 기반 재고 관리 시스템 제작 및 React & Redux로 재고 관리 시스템 개편 - 재고 관리 시스템의 모바일 지원을 위한 Progressive Web Apps 적용 및 푸시 알람 구현
[시스템 구축] 사용자 데이터 분석 시스템 (Product analytics) 구축
chevron

핑크퐁 스토어 사용자 및 구매 데이터 분석을 위한 Google Analytics Enhanced Ecommerce (관련 블로그 글) (관련 발표)

Lezhin Entertainment

[서비스 개발] 관리자 웹 애플리케이션 SPA 개발
chevron

웹툰 작가 및 PD 용 관리자 웹 애플리케이션(Admin)을 Angular.js로 SPA 개발

[시스템 구축] 사용자 데이터 분석 시스템 (Product analytics) 구축
chevron

레진코믹스 홈페이지에 Google Analytics 연동 및 UI 개편을 위한 데이터 제공

[시스템 구축] End-to-end 테스트 자동화 시스템 구축
chevron

레진코믹스 홈페이지의 UI 기능 테스트를 위한 Phantom.js 헤드리스 테스팅 구현

외부 활동

2024

[개인 프로젝트] Shoot: Goal management system
chevron

Link

만든 배경

  • 50개가 넘는 생산성 앱을 써본 후, 나에게 맞는 앱을 찾기 어려워 직접 만들었습니다. 현재 저는 메인 투두 앱으로 사용하고 있고, 가입자 수는 19명입니다 (회사 내 지인들에게만 공개. 추후 Billing 시스템을 갖춘 후 외부 공개 예정)

컨셉

Goal oriented: 카테고리 대신 목표를 기준으로 태스크를 관리해요. 이로서 내가 어떤 목표를 달성하기 위해 이 일을 하고 있는지 상기할 수 있어요.

High layer view: 한 해 나의 시도와 성취를 한 눈에 볼 수 있는 'Achieved' 뷰가 있습니다.

Simplicity: Goals, Focus, Today 3개의 칼럼으로 전체 할일을 관리하는 프레임입니다. 조만간 할 일은 Focus로, 오늘 당장 할 일은 Today로 마킹합니다.

[영상] 모닥불 | EP.1 토스에서 말하는 “가독성 좋은 코드” 란 무엇일까?
link
[인터뷰] 토스 프론트엔드 챕터 리드는 ‘구성원을 서포팅 하는 사람’이에요!
link
[발표] ICT인턴십, 강남고용센터 - 어쩌다 개발자
link

2023

[발표] 인프콘 - 팀 플레이어 101
link
[발표] SLASH 23 - 퍼널: 쏟아지는 페이지 한 방에 관리하기
link

2021

[발표] SLASH 21 - 실무에서 바로 쓰는 Frontend Clean Code
link
[인터뷰] 헤이조이스 인터뷰
link

~2020

[집필] 팀 개발을 위한 Git & GitHub 시작하기(2020.01.02), 한빛미디어
chevron
[컨퍼런스 개최] Data Science is a Team Sports
chevron
  1. 컨퍼런스 랜딩 사이트 제작 (https://milooy.github.io/DSTS2019/)
  • 컨퍼런스 스폰서 목록을 표시하는 ‘전자 디스플레이’ 섹션
  • 애니메이션을 통해 스포츠 선수 소개 컨셉의 세션 상세 정보 노출 image
  1. 대표 오거나이저로서 컨퍼런스 전체 구성 및 진행
image
[발표] 삼성전자 SOSCON 기조연설 | 주니어 개발자 5000명, 개발 해서 남 주자
link
[발표] 공개 SW 컨퍼런스 기조 연설 외 Facebook (Seoul, Hanoi), IBM, Microsoft, 고려대, 성신여대, 대덕마이스터고, 한양여대, 원광대 등 다수 기술 강연
chevron
imageimage

Education

NHN NEXT (1기) - 컴퓨터 공학 2013.03 - 2016.02

Language

  • Korean(Native)

  • English(Professional)

    Zepl 회사에서 다국적 팀원들과 2년간 영어로 일한 경험이 있습니다.
    chevron
    imageimage
    Facebook Developer Circle활동을 하며 다국적 매니저들과 영어로 커뮤니티를 매니징 한 경험이 있습니다
    chevron
    imageimageimage
With love, Yurim Jin