민대인 (bamin0422).
Learn once, write anywhere. 디자인 시스템을 코드로 구현한다는 관점에서, 재사용 가능한 컴포넌트를 설계하고 모노레포 구조로 관리해 왔습니다. 안드로이드 개발 시기 배웠던 MVVM 아키텍처의 명확한 역할 분리와 모듈화 개념을, 웹에서는 Feature-Sliced Design으로 재해석하고 적용하고 있습니다. 로직이 UI를 침범하지 않도록, 상태 관리 도구 (Jotai, TanStack Query 등)와 커스텀 훅을 활용해 핵심 로직을 명확하게 분리합니다. 이 접근은 앱 개발 시 ViewModel을 분리하던 경험에서 출발했고, 현재는 웹에서도 동일한 철학으로 적용하고 있습니다. Lazy Loading, 코드 스플리팅, 이미지 최적화를 통해 사용자 체감 성능을 개선하고, ErrorBoundary로 예외 상황에서도 안정적인 UI를 유지합니다. 성능은 곧 사용자 경험의 품질이라 믿고, 이를 지속적으로 개선합니다. Model Context Protocol (MCP) 서버를 개발하여 사업자등록번호 진위 확인 및 정보 조회 기능을 구현했습니다. MVC 패턴을 적용한 TypeScript 기반 서버로, REST API와 MCP 도구를 동시에 제공합니다. Docker 컨테이너화와 Smithery AI 배포를 지원하며, 공공데이터포털 API 연동을 통해 실시간 사업자 정보를 조회할 수 있습니다.
하나의 기술을 배워 여러 환경에 녹여내는 데에서 개발자로서의 가치를 찾습니다.
저는 처음엔 안드로이드 개발자로 커리어를 시작했습니다. 단말기 최적화, 화면 구성, 다양한 해상도 대응 등 모바일 특유의 제약 속에서 사용성과 안정성을 고려하며 UI를 다뤘습니다. 이 경험은 제가 프론트엔드로 전향한 이후에도, "사용자 경험을 설계하는 눈"으로 그대로 이어졌습니다. React와 Next.js를 중심으로 웹 개발을 이어가며, 이제는 웹과 앱, 데스크톱 등 다양한 플랫폼을 넘나들며 일관된 사용자 경험과 유지보수 가능한 구조를 추구하고 있습니다.컴포넌트 중심의 UI 설계
FSD를 통한, 비즈니스 로직과 프레젠테이션의 분리
플랫폼 특성에 맞춘 성능 최적화
MCP 서버 개발 및 API 설계
Work.
다우기술.
Frontend Developer2023.07 ~ 현재다우오피스 4.0 Frontend 운영.
다우오피스 4.0 프론트엔드 운영 및 유지보수 작업을 진행하고 있습니다.My Task.- 다우오피스 4.0.0.0 ~ 부터 운영 및 유지보수 작업.
- Bitbucket Webhook과 LLM 활용 코드리뷰 자동화.
- IE, Chrome, Safari 등 다양한 브라우저 환경에서의 호환성 이슈 해결.
- 운영 중 발생하는 결함 건 해결 및 개선.
- Electron 기반 PC 메신저 결함 건 해결 및 개선.
- 모바일 웹 브릿지 연동 및 모바일 웹 브릿지 결함 건 해결 및 개선.
다우오피스 4.0 Frontend 개발.
Backbone.js로 구성되어 있는 다우오피스 Frontend를 Next.js, TypeScript기반으로 모노레포로 구성하여 기존 다우오피스의 프론트엔드를 개선해 개발하는 프로젝트입니다.My Task.- 공통 컴포넌트 개발: Calendar, DatePicker, Table, CheckBox, AddressDialog, Kakaomap 등.
- 공통 컴포넌트 개발: Turbo Code Generator를 활용해, 불필요하게 컴포넌트를 생성할 필요없이 mdx와 stories 파일과 공통 컴포넌트 구성 파일을 Generating할 수 있게 구현.
- 기존 그룹웨어 컨텐츠 개선 : Backbone.js로 되어있는 프로젝트를 모두 migration하지 못해 기존 컨텐츠의 스타일 및 기능을 개선해 로드.
- 기존 스크립트 방식으로 로드해 사용할 수 밖에 없는 카카오맵을 선언적으로 사용할 수 있도록 컴포넌트화해 구성.
- 인증 및 사용자 정보: 로그인 로직 구성, 간편 비밀번호 컴포넌트 및 Provider 구현, Tanstack Query와 GraphQL 활용 사용자 정보 fetch.
- 대시보드-가젯 포팅: 기존 Backbone.js 코드로 작성되어 있는 가젯 코드들을 리액트 코드로 포팅하는 작업. (캘린더, Works 차트형, ToDo+, 예약 바로가기 가젯 등)
- 통합설정: 통합으로 환경설정하는 부분으로, 관리에 나타나는 여러 Table을 Tanstack Table을 활용해 구현.
- 경영업무포탈-GNB : jotai의 atomWithStorage 사용해, cookieStorage에 최근 사용한 목록 정보 저장. 즐겨찾기는 Tanstack Query의 useMutation 사용해 구현. 검색 기능은 Fuse.js를 활용해 구현.
- 경영업무포탈-Tab : jotai의 atomWithStorage를 활용해 sessionStorage에 선택된 탭들을 저장하는 로직 구현. Tab 컴포넌트 구현.
다우기술.
Android Developer2022.11 ~ 2023.07Enfax - 안드로이드 앱 유지보수.
모바일 팩스 - Enfax, 안드로이드 앱 유지보수 및 리뷰 이벤트 팝업 노출 개발 건입니다.My Task.- 불필요한 의존성 주입 제거 및 Retrofit Base Url 로직 개선.
- 앱 리뷰 이벤트 팝업 공지 노출 (useCase 생성).
- WebView 캐시모드 설정 통한, 이벤트 팝업 다이얼로그에 개발 완료 이전 페이지 보여지는 현상 해결.
삐약삐약 안드로이드 앱 운영 및 2차 개발.
영양제 복용관리 및 추천 서비스, 삐약삐약 안드로이드 앱 1.0.0.0 ~ 1.0.2.4 버전 관리 및 운영, 2차 개발.My Task.- Mobile Web과 WebBridge 연결 (판매링크, 건강기록 화면 수정 다이얼로그 등).
- KMM(Kotlin Multiplatform Mobile)로 MVVM 아키텍쳐에 맞춰, Android, iOS 공통 비즈니스 로직 작성.
- TripleT와 Jenkins 활용, 출시노트 포함해 구글플레이 각 트랙별 자동 배포할 수 있도록 구현.
- 2차 개발 UI 및 기능 구현.
Project.
- MVC 패턴 기반 TypeScript 서버 아키텍처 설계 및 구현
- REST API와 MCP 도구 동시 제공 구조 설계
- 공공데이터포털 API 연동 및 사업자등록번호 검증 로직 구현
- Docker 컨테이너화 및 Smithery AI 배포 설정
- 사업자 정보 조회 및 진위 확인 기능 개발
- API 인증키 관리 및 보안 처리
- 에러 핸들링 및 로깅 시스템 구축
- 프로젝트 전개 및 패키지 매니저 npm 설정.
- 정규 표현식 추가.
- 패키지 배포 및 버전 관리.
- 프로젝트 전개 및 FSD 아키텍쳐 기반으로 구조 설정.
- framer-motion 통한, SearchBar 컴포넌트 애니메이션 적용 및 구현.
- framer-motion 통한, Timer 컴포넌트 애니메이션 적용 및 구현.
- Timer 컴포넌트 사용 위한, useTimer 훅 구현.
- color picker 라이브러리 활용해, color picker 구현.
- Timer 컴포넌트 사용 위한, useTimer 훅 구현.
- Next.js API Routes 사용해, CORS Error 방지.
- Vercel Deploy.