스스로의 역할을 비즈니스 마인드를 갖춘 제품 메이커로 정의합니다.
- 코드를 잘 짜는 것만큼 그 코드가 왜 필요한지, 더 나은 방법은 없을지 고민합니다.
- 제품을 만드는 전 과정에 관심을 갖고 요구사항이 나오기까지의 맥락을 파악합니다.
- 더 나은 사용자 경험을 위한 아이디어라면 역할 구분 없이 제안하고, 주도적으로 기여합니다.
Work Experience.
샤플앤컴퍼니
Frontend Engineer2022.08 - now
SHOPL 서비스 링크↗
2023.09 - now
현장직을 위한 인사 관리 • 협업툴을 지원하는 B2B SaaS 서비스입니다. JSP 기반의 프로젝트를 React로 전환해나가며 디자인 시스템 개발을 병행하고 있습니다. 근태 관리 기능을 담당하는 목적 조직의 1인 프론트개발자로서 요구사항 분석부터 개발까지 폭넓게 참여하고 있습니다.
pnpm 기반 Monorepo React TypeScript Zustand TanStack Query Emotion
근태 관리 기능을 React 기반으로 재설계하며, 기능 고도화와 무중단 마이그레이션을 함께 진행하고 있습니다.
- JSP 프로젝트를 React로 점진적 전환하며 서비스 중단 없는 마이그레이션 구현
- iframe + postMessage로 JSP와 React가 충돌없이 공존하도록 구현
- 근태 유형에 따라 반복되는 분기 처리를 전략 패턴을 활용해 정리 블로그 포스팅↗
- 파편화되어 반복되는 조건문을 공통 인터페이스 기반 전략 객체로 추상화, 신규 근태 유형 추가 시 수정 범위 최소화 및 유지보수성 향상
- 컴파운드 패턴 기반 공통 UI 컴포넌트(FilterBar, Slider 등) 개발
- 내부 요소를 고정된 스타일의 서브컴포넌트로 조립하는 구조로 설계해 재사용성과 개발 효율을 높임
자동화 도구를 만들어 커뮤니케이션 병목을 해결했습니다. GitHub 링크↗
기술 스택과 디자인 시스템 적용 여부를 자동 식별·시각화하는 크롬 익스텐션 개발
-
JSP와 React 영역을 자동 식별해 기술 스택 관련 커뮤니케이션 병목 해소 블로그 포스팅↗
- React와 JSP가 혼용된 환경에서 비개발 직군이 자체적으로 기술 스택을 판별하기 어려운 문제를 해결하기 위해 직접 기획·개발
- URL·iframe·DOM 구조 분석으로 JSP/React/React-in-JSP 영역을 자동 식별 및 하이라이팅
- 매일 2~3회 반복되던 기술 스택 확인 커뮤니케이션을 완전히 제거
-
디자인 시스템 적용 여부를 자동화해 협업 효율 향상
- data-set 속성 기반으로 컴포넌트 명칭을 노출하고, 적용 여부를 하이라이팅해 디자인 시스템 적용 상황 시각화
- react-portal 적용으로 z-index 충돌 방지 및 UI 일관성 확보
디자인 시스템을 운영하며 component driven development를 실천했습니다. GitHub 링크↗
- 표준적인 인터페이스를 채택해 컴포넌트 의도를 명확히 전달하도록 설계
- 다른 Repository 프로젝트에 심볼릭 링크로 연동해 수정 사항을 실시간 반영
번거롭던 디자인 시스템 문서작성을 AI로 자동화했습니다. 블로그 포스팅↗
- 팀원들이 문서 작성을 번거로워하고 휴먼 에러가 잦던 문제를 해결하기 위해 Cursor Agent와 Rule을 활용한 문서작성 자동화
- 채팅 기반 입력과 Few-shot Prompting·Chain-of-Thought 기법을 적용해 문맥을 정확히 전달하고, 문서 초안 생성을 AI에게 위임
- 문서는 작업 계획 컨펌 이후에만 생성되도록 하여 개발자 주도권을 보장하고, 누락·불일치를 제거하며 문서화 부담을 크게 줄임
비개발팀의 업무 흐름을 자동화해 조직 전반의 협업 효율을 높였습니다.
- 수작업에 의존하던 비개발팀의 정보 전달 흐름을 관찰해 문제를 정의하고, Slack Workflow로 자동화 도구 설계 블로그 포스팅↗
- 반복 입력과 실수 없이 정보를 공유할 수 있어, 조직 전반의 커뮤니케이션 효율 및 업무 일관성 향상
흩어져 있던 온보딩 정보를 문서화해 신규 입사자의 빠른 적응을 도왔습니다.
- 신규 입사자의 소프트랜딩을 돕기 위해 서비스 소개, 팀 운영 방식, 협업 흐름, 코드베이스 구조를 단계별로 정리한 온보딩 문서 작성
- 반복 설명 없이 팀 맥락과 기술 흐름을 전달할 수 있어 온보딩 효율성과 일관성 확보
하다 서비스 링크↗
2022.08 - 2023.09
현장 시설을 디지털로 관리하는 B2B SaaS 솔루션 서비스입니다. 서비스 런칭 1개월 후 합류해 신규 기능을 개발해나갔습니다. 2023.09 이후 내부 사정으로 프로젝트 개발이 중단되어 SHOPL 서비스를 담당하게 되었습니다.
React(CRA) TypeScript Zustand TanStack Query Emotion
다양한 기능을 가진 컴포넌트를 조립형 구조로 설계했습니다.
- 단일 모달에서 이슈를 등록하고 해결하는 기능 개발시 재사용성과 확장성을 고려해 기능별 모듈화 및 조립형 UI 구성
일괄 처리 방식으로 인한 timeout 이슈를 해결하고 복잡한 입력 검증을 구현했습니다.
- 3,000건 이상의 시설 데이터를 일괄 처리하는 과정에서 timeout이 발생해 chunk 처리 방식으로 해결
- MUI DataGrid 기반으로 column/row 단위 validation을 커스터마이징해 복잡한 요구사항 대응
반장창고
Frontend Engineer2021.12 - 2022.07
하우스텝 서비스 링크↗
인테리어 솔루션 서비스 하우스텝의 영업인력이 각종 자재를 관리하기 위한 어드민 개발을 담당했습니다. 이후 회사 내부 사정으로 프로젝트 중단되었고, 랜딩 페이지 유지보수를 담당했습니다.
React(CRA) TypeScript TanStack Query styled-components
기획 공백 속에서도 주도적으로 요구사항을 정의하고 구현했습니다.
- 기획자 없이 영업팀·백엔드 개발자·디자이너와 협업하며 요구사항 정리 및 화면 구조 설계
- 업무 흐름을 고려한 기능 단위 MVP 설계 및 UI 컴포넌트 구현 주도
일관된 협업을 위한 커밋 컨벤션을 정립하고 자동화했습니다.
- 서로 다른 커밋 메시지로 인한 코드 이력 가독성 저하 및 협업 혼선 발생
- commitizen 기반 커밋 컨벤션 정의 및 pre-commit 자동화 도입 블로그 포스팅↗
김앤장 법률사무소
비서2018.05 - 2021.07
Finance Department
⚠️ 비개발 직군 경력
- 법률 프로젝트의 데이터 관리 및 업무 정보 및 흐름을 파악해 국・영문 문서 작성
- 잦은 일정 변경을 관련 부서와 신속하게 소통하며 대응, 시간에 민감한 법률 업무가 원활하게 진행되도록 기여