Frontend Developer

정성훈

인프콘 2024

성실함

책임감

협업 지향

목표 지향적

자기 주도적

https://github.com/sh-oon

다양한 문서 확장자 클라우드 서비스 및 LLM 기반 보고서 생성 및 편집, 챗봇 기능을 제공하는 플랫폼<ul><li>UX를 고려해 Event Stream 기반 챗봇 기능 구현</li><li>다양한 포맷(.pdf, .docx, .xlxs) Viewer 및 편집 기능 구현</li><li>FSD Architecture 도입으로 유지보수성 개선</li><li>gpu 사용량, 토큰 사용량 등의 정보를 제공하는 대시보드 구현</li><li>모델 선택, 지식 관리 등 다양한 기능을 제공하는 관리도구 개발</li></ul>

SurroDocs

공장의 제조 공정을 시각화하여 작업지시, 자재 소요, 생산 추적, 설비관리, 생산성과 분석 등의 생산관리 효율성을 높이는 정보를 제공하는 플랫폼<h3></h3><ul><li>기존&nbsp;코드의&nbsp;가독성과&nbsp;유지보수성을&nbsp;개선하고자&nbsp;Compound&nbsp;Component&nbsp;Pattern을&nbsp;적용하여&nbsp;고도화&nbsp;진행</li><li>react-query&nbsp;도입을&nbsp;주도하여&nbsp;서버&nbsp;상태&nbsp;관리와&nbsp;데이터&nbsp;캐싱을&nbsp;이용해&nbsp;서버&nbsp;비용&nbsp;절감&nbsp;효과</li><li>Jenkins와&nbsp;Docker-Compose를&nbsp;활용한&nbsp;정적 파일 자동&nbsp;배포&nbsp;파이프라인&nbsp;구축</li><li>Vite&nbsp;마이그레이션을&nbsp;통해&nbsp;빌드&nbsp;시간&nbsp;67%&nbsp;단축과&nbsp;개발&nbsp;서버&nbsp;시작시간&nbsp;감소로&nbsp;생산성&nbsp;개선</li><li>context api를 사용한 모달 컴포넌트 개발 ex) modal, confirm, toast, alert 등</li></ul>

제조 실행 시스템 플랫폼(MES)

조립식 건축물을 3D 환경에서 직접 설계하고 예상 견적과 조감도를 제공하는 플랫폼<h4>3D 건축 설계 플랫폼</h4><ul><li>CSR방식의&nbsp;SEO&nbsp;한계점을&nbsp;개선하고자&nbsp;하여&nbsp;Express.js를&nbsp;사용한&nbsp;SSG&nbsp;방식으로&nbsp;전환하여&nbsp;SEO&nbsp;점수&nbsp;개선</li><li>코드&nbsp;스플리팅과&nbsp;이미지&nbsp;리사이징&nbsp;및&nbsp;Webp&nbsp;포맷&nbsp;변환을&nbsp;통해&nbsp;웹&nbsp;성능&nbsp;지표&nbsp;개선</li><li>Kakao&nbsp;map&nbsp;api와&nbsp;공공&nbsp;api를&nbsp;사용하여&nbsp;지도에&nbsp;다양한&nbsp;폴리곤&nbsp;표시&nbsp;및&nbsp;핸들링&nbsp;기능&nbsp;구현</li><li>Three.js를&nbsp;사용하여&nbsp;다양한&nbsp;주택의&nbsp;예상&nbsp;견적과&nbsp;조감도&nbsp;제공&nbsp;기능&nbsp;구현</li><li>Headless&nbsp;Chromium을&nbsp;도입해&nbsp;PDF&nbsp;생성&nbsp;시,&nbsp;크로스&nbsp;브라우징&nbsp;이슈&nbsp;해결</li></ul><h4>건축 상담 관리 및 관련 데이터 시각화</h4><ul><li>rechart를 활용한 상담 관련 데이터의 시각화 기능 구현</li><li>웹훅과 pm2를 활용한 정적 배포 파이프라인 구축</li><li>Atomic Design Pattern으로 재사용성이 높은 컴포넌트 구현</li></ul>

빌드 심플리

미아방지 목걸이 등의 개인정보 유출을 개선하기 위한 p2p 기반의 서비스<ul><li>WebSocket&nbsp;기반의&nbsp;채팅&nbsp;기능&nbsp;구현</li><li>P2P&nbsp;기반의&nbsp;영상/음성&nbsp;통화&nbsp;기능&nbsp;구현</li><li>Geolocation&nbsp;api와&nbsp;Kakao&nbsp;map&nbsp;api를&nbsp;활용한&nbsp;실시간&nbsp;위치&nbsp;공유&nbsp;기능&nbsp;구현</li><li>서비스의&nbsp;국제화를&nbsp;고려하여&nbsp;i18n.js를통해&nbsp;영문&nbsp;서비스&nbsp;제공</li></ul>

미아찾기 서비스

사용자가 직접 펜던트 시안을 제작할 수 있는 커스텀 서비스와 상품의 구매, 결제 장바구니 등의 e-commerce 플랫폼<h4>펜던트 커스텀 서비스 고도화</h4><ul><li>프로젝트의&nbsp;규모&nbsp;증가로&nbsp;인한&nbsp;빌드&nbsp;시간이&nbsp;늘어나는&nbsp;현상과&nbsp;Vue&nbsp;2의&nbsp;지원&nbsp;종료로&nbsp;인한&nbsp;Vue3,&nbsp;Vite&nbsp;마이그레이션</li><li>Canvas&nbsp;api를&nbsp;활용해&nbsp;이미지&nbsp;편집&nbsp;기능&nbsp;구현</li><li>JWT와&nbsp;OAuth&nbsp;2.0을&nbsp;활용한&nbsp;로그인과&nbsp;라우터&nbsp;가드&nbsp;기능&nbsp;구현</li><li>사용자가 제작한 펜던트에 대한 저작권 권한 등의 약관동의, 휴대폰 또는 이메일 인증 기능 화면 설계 및 구현</li></ul><h4>모두디자이너 e-commerce 개발</h4><ul><li>장바구니, 쿠폰 사용, 상품 결제 기능 구현</li><li>인피니티 스크롤을 적용해 상품 목록을 사용자 스크롤에 따라 동적으로 로드하여 사용자 경험(UX)과 성능을 개선 </li></ul><h4>모두디자니어 백오피스 개발</h4><ul><li>재고관리, 주문관리 등의 전반적인 기능 설계 및 구현</li><li>템플릿 엔진을 활용한 알림톡 및 메일링 기능의 UI 구현</li><li>주기적인 서버의 백로그를 확인하기 위해 백로그 모니터링 기능 구현</li></ul>

커스텀 펜던트 플랫폼

<ul><li>3D 건축설계 플랫폼 고도화 작업 및 제조 실행 시스템(MES) 고도화 작업 담당</li><li>PDF 생성 기능 개선 및 고도화</li><li>기존 CSR 방식의 성능 및 SEO를 개선하기위해 SSG 방식으로 전환</li><li>react-query를 사용한 효율적인 데이터 캐싱을 통해 서버 리소스 사용 개선</li></ul>

<ul><li>개인정보 유출을 개선한 미아찾기 서비스 초기 설계 및 구현</li><li>다양한 맞춤형 주얼리의 니즈를 해소해 줄 수 있는 이미지 편집 기능 기반의 커스텀 펜던트 플랫폼 고도화 및 운영</li><li>재고, 주문등의 관리와 송장 출력과 알림톡 기능 등을 제공하는 백오피스 기능 구현</li><li>Vue 2.0으로 이루어진 레거시 프로젝트의 Vue 3.0 마이그레이션</li></ul>