소개

💁 Profile

🙎 어떤 개발자 인가요?

  • 꾸준히 기록하고 회고합니다. 회고를 반영해 개선합니다. 제가 성장하는 방식입니다.

  • 모든 기술 의사결정은 프로젝트가 처해있는 상황에 의존적입니다. 모든 의사결정은 trade-off 입니다. 따라서 그 상황에 적절한 의사결정을 위해 고민하고 노력합니다.

  • 적절한 기술 의사결정을 위해서는 선택할 수 있는 옵션이 다양해야 합니다. 그 옵션을 늘리기 위한 노력으로 보고 듣고 읽고 정리합니다.

🧑🏻‍💻 Capability

기술 부채 이슈레이즈 및 해결책 제안

팀에서 발생하고 있는 혹은 발생 가능성 있는 문제를 빠르게 인지하여 이슈레이즈 하고 문제를 해결할 방향성을 제시합니다.

💡 Router Loading 관련 이슈 레이즈, 뱅크샐러드, 2021.10

웹뷰 라우터 로딩중 로더뷰가 렌더를 block하는 이슈에 대해 진단하고, 이를 위한 해결책을 제시

💡 우아한 비동기 처리 적용 및 웹팀 전반에 도입 제안, 뱅크샐러드, 2021.5

react-query, suspense 를 활용해서 AsyncBoundary라는 Provider 컴포넌트를 통해 에러, 로딩 처리를 추상화하고 코드 가독성 확보

💡 nextjs 에서 SSR 을 쓰지않고 SSG만 하도록 제안 뱅크샐러드, 2022.04

당시 웹팁의 환경에서 SSR 을 쓰면 어떤 이슈가 발생하는지 파악하고, SSR을 쓰려면 어떻게 해야하며, 현 상황에서 SSG를 쓰는 것이 최적의 선택인지 설명

💡 mock testing 환경 구성 뱅크샐러드, 2023.02

금융 서비스 개발을 하다 보니 개인이 가지고 있는 금융 상품이 없어 각 제품을 테스트하고 재현하는데 많은 비용이 들고 있었고, 이를 mock testing 환경 구성으로 해결하는 방법을 제안

  • msw, factory.ts, inline-snapshot 을 통한 코드 문서화 및 재현이 쉬운 환경 제안

팀 생산성 향상

  • 에디터의 편의 기능(custom snippet, 각종 단축키, extension)에 대해 정리하고 팁을 공유합니다.

  • 이슈가 있거나, 병목이 있었던 작업은 마친 뒤에 회고하고 기록해서 추후 같은 이슈 상황을 원활히 해결하고 시간을 줄입니다. (이슈리스트)

  • 팀내 위키 문서 제작, 🏦 뱅크샐러드

  • 배포 관련 스크립트 작성으로 편의성 제공, 🏦 뱅크샐러드

  • 네이티브 웹뷰 테스팅 환경 구성, 🏦 뱅크샐러드

  • 뱅크 샐러드 테크 팀 전체를 위한 편의 도구 제작, 🏦 뱅크샐러드

  • 웹 프론트엔드 스타일 가이드 작성 및 적용, 🏦 뱅크샐러드

    이슈:

  • 튜터링 초등 서비스 백엔드/프론트 분리, 🏫 튜터링

    이슈

    • 백엔드와 프론트의 배포주기가 달라, 백엔드의 배포주기에 프론트 수정을 같이 태워야함

    • laravel-mix 로 vue와 laravel이 한 레포에 묶여 있어서 개발시에 hot-reload 같은 기능을 사용하지 못하고, 매번 새로고침을 해서 작업 결과를 확인해야 함

    • webpack 관련 튜닝을 해야할 때 larabel-mix의 의존성으로 인해 custom 한 튜닝을 하기 어려움

    • serverside 렌더링도 아닌데, 매번 라라벨 서버가 js, css, html을 서빙해야 하는 상황

    해결

    • 프론트 환경을 백엔드 환경과 분리

    임펙트

    • 배포주기가 다른 부분 해결

    • hot reload, source map 설정등을 통해 보다 편한 프론트엔드 개발환경 구성

    • eslint, prettier, editor config 등의 정적 분석 도구를 통해 불필요한 코드 수정 방지

    • webpack 튜닝을 통해 output 된 파일들의 용량 감소

    학습

    • webpack, babel 등의 프론트엔드 번들 시스템에 대한 이해

문서화

협업 및 커뮤니케이션

  • 빠른 의사결정을 유도하기 위해 필요한 정보를 간결하게 정리하여 공유합니다.

  • 테크 전체적인 문제를 발견하여 진단하고 이슈레이즈 하여 제안과 문제 해결하기

  • 네이티브 개발자들과 협업 하여 웹뷰 개발환경 블로커 해결

  • 이해관계가 다른 당사자들을 싱크해서 문제를 해결했던 경험

레거시 운영 및 유지보수

  • 투자, 자동차, 연금, 연말정산, 빨대카드 등의 레거시 서비스 유지보수 및 다크모드 지원 작업,서비스 종료 작업, 뱅크샐러드, 2021.01 ~ 2022.12

    • 이전에 흩어진 자료들을 모아 유지보수할 수 있는 최소한의 정보를 모아 정리하고, 사용되지 않는 퍼널을 찾아 불필요한 코드를 제거했습니다.

    • 위 작업을 통해 서비스 종료 논의가 있을 때 보다 쉽게 의사결정 내릴 수 있는 환경을 구축했습니다.

  • 영어, 중국어 통합으로 유지되던 기존 앱에서 중국어 별도 앱으로 분리, 🏫 튜터링, 2020.02 ~ 2020.05

    해당 작업을 안정적으로 하기 위해 프론트 코드 전체에 대해 빠르게 이해해야 했고 그 과정에서 타인이 작성한 코드에서 의도를 읽어내는 훈련을 지속적으로 할 수 있었습니다. 그 경험을 통해 타인이 작성한 코드를 빠르게 이해하고 해당 코드 베이스를 바탕으로 새로 생긴 이슈를 원활하게 해결할 수 있습니다.

  • 튜터(선생님)가 쓰는 어드민 유지보수, 🏫 튜터링 2019.12 ~ 2020.05

    수업 화면을 진입하려면 꼭 실제 통화 상태를 만들어야 해서 수업화면의 유지보수를 하기가 어려운 상황을 개선했습니다. 화면과 비지니스 로직을 분리하여 화면 자체는 mockData로 띄울 수 있게 만들어 보다 유지보수가 쉬운 환경을 만들었습니다.

마케팅 관련 툴에 대한 높은 이해도

  • GA 관련 이슈에 대한 문제 해결 제안

  • GA, 엠플리튜드 세팅 관련 문제 해결

     

💼 CAREER

뱅크샐러드 2020.10 ~ 재직중

SKILL

  • Typescript, React, next.js, emotion, tailwind, react-query, jest, react-testing-library, redux-toolkit,

R&R

  • PFM 스쿼드 → 자산 증식 PA(Product Area) 2021.01 ~ 현재

    • 대출 진단, 저축진단 등의 진단 기능 개발

    • 자산(은행, 카드, 보험, 페이머니, 투자) 상세 페이지 웹뷰 개발

    • 마이데이터 인가를 위한 대응

  • 실험플랫폼 유지보수 2020.10 ~ 2021.01

    • 실험 결과 차트 추가

    • 실험 입력 폼 고도화

    • 실험 복사 기능

튜터링, 프론트엔드 개발, 2019.12 ~ 2020.10

SKILL

  • javascript, react, redux, vue, vuex, react-native, webpack, web-socket, web-rtc

R&R

  • 튜터링 초등 서비스 초기 개발 2020.04 ~ 2020.10

  • 튜터링 영어+중국어 앱, 영어 앱, 중국어 앱분리 프로젝트 2020.02 ~ 2020.04

  • 튜터링 서비스, 튜터 전용 어드민 페이지 유지보수 2019.12 ~ 2020.03

아티언스, 웹 데이터 수집 및 분석 컨설팅, 2017.12 ~ 2019.04

SKILL

  • Google Analytics , Google Tag Manager, Facebook Pixel, Hotjar

  • javascript, jquery, html

R&R

  • GA E-commerce, Custom Event, Goal 세팅 및 데이터 분석 및 페이스북 및 트위터 픽셀 관리

  • 기아/현대 해외 법인 사이트 컨설팅 PM

  • U+ 개인(B2C) 및 법인(B2B) 사이트 컨설팅 PM

👨‍👧‍👦 SOCIAL

글또 8기 (2023.02 ~ 2023.06)

  • 글또 8기에 참여하여 지속적인 기술 블로그 활동 중

Every Analytics 오픈소스 활동 (2021.07 ~ 2020.08)

Dooboo-UI 오픈소스 활동 (2020.07 ~ 2020.10)

게시글