Contact
📞 010 - 4491 - 1040
✉️ [email protected]
<aside>
<img src="/icons/cactus_orange.svg" alt="/icons/cactus_orange.svg" width="40px" /> 공감을 중요시하고 프론트엔드에 강점을 가진 개발자 권영균입니다.
소비자학을 전공하며 사용자 니즈를 분석하고 타겟팅하는 법을 바탕으로, 실사용자가 서비스에서 겪는 불편함을 깊이 이해하고 공감하는 것이 진정한 사용자 경험을 설계하는 핵심이라고 믿습니다. 단순히 기술을 적용하는 것을 넘어 사용자 입장에서 직관적이고 편리한 UX를 제공하기 위해 끊임없이 고민하고 개선해 왔습니다. 특히, 3년간 인천공항 및 김포공항 공식 발렛 서비스 프로젝트를 풀스택으로 개발하고 유지 보수하면서 실서비스를 운영한 경험은 저의 가장 큰 강점입니다. 수많은 실시간 사용자의 피드백을 분석하고 즉각적으로 대응하며, 서비스의 안정성과 사용성 개선에 힘썼습니다. 또한, Lighthouse를 활용해 성능, 접근성, SEO 등의 종합적인 성능을 분석하여 웹페이지 로딩 속도를 개선하고 접근성을 강화하는 등 프론트엔드 성능 최적화도 진행했습니다.
앞으로도 이러한 경험을 바탕으로 사용자 중심의 서비스 개선과 팀원들과의 소통 및 공감을 통해 함께 성장하고, 더 나은 사용자 경험을 제공하는 개발자가 되고자 합니다.
</aside>
Work History
파운트
2024.11 -
- 하나은행 어플리케이션(1Q)의 퇴직연금 로보어드바이저 일임서비스 개발 및 유지보수
휴맥스모빌리티
2021.11 - 2024.11
- 인천/김포공항 공식 발레 서비스 초반 2022년 1월 300명 대비 2024년 7월 기준 일일 이용객 2,000명 이상 달성
- 클라이언트 플랫폼/백오피스 플랫폼 구현 및 유지 보수
- Mixin 패턴을 통해 컴포넌트를 기능 단위로 분리하여 공유하고, 코드 중복을 줄여 재활용성을 높임
- MVC 패턴을 사용하여 애플리케이션의 기능을 모델, 뷰, 컨트롤러로 분리해 유지 보수성과 재사용성을 높여 공유하여 구현
- 컴포넌트 모듈화를 통해 중복 코드의 최소화 및 회사 백오피스 보일러 템플릿 및 코드베이스에 기여
- 국정원 보안 규정을 준수한 데이터베이스 AES 암호화 및 클라이언트 플랫폼 CAPTCHA 적용
- 다양한 플랫폼에 필요한 기능의 RESTful API 개발
- 소켓 통신과 스케줄러를 활용하여 공항과 실시간 차량 데이터 공유 구현
- X-Path 문법과 Puppeteer를 사용하여 주차 정산 자동화 매크로 개발
Skills
Frontend - React(Next.js) / Vue(Nuxt.js) / TypeScript
Backend - Node.js / Sequelize / Koa / MySQL
Collaboration tool - Git / Jira / Confluence / Figma
Projects
하이파킹 인천공항 / 김포공항 공식 발렛 서비스
2022.01 -
Nuxt.js / Node.js / Sequelize / Koa / MySQL
프리미엄 주차 대행 서비스 투루 발렛+으로 인천공항, 김포공항 발렛 서비스는 일일평균 2,000건의 이용고객의 예약 도착 / 차량인도 / 주차 및 안전 보관 등을 운영관리하는 주차대행 서비스
인천공항 공식 발렛 서비스 - https://valet.hiparking.co.kr/
김포공항 공식 발렛 서비스 - https://gmp.turuvalet.co.kr/
[Frontend]
클라이언트
- 컴포넌트 모듈화를 통한 중복 코드 최소화로 개발 생산성을 향상, 회사의 프론트엔드 보일러플레이트 및 코드베이스에 기여함으로써, 새로운 기능 개발과 유지 보수가 더욱 효율적으로 이루어졌으며, 일관된 코드로 품질 유지
- 국정원 보안 규정을 준수한 클라이언트 플랫폼의 CAPTCHA 적용을 통해 사용자 데이터의 보안을 강화 및 악의적인 접근을 차단하고, 서비스의 신뢰성을 높이며 사용자의 안전 확보
- SEO 최적화와 Google Tag Manager(GTM) 분석으로 사용자 이용 빈도를 체계적으로 관리, 566% 사용자 증가 달성 및 유입 경로 최적화를 통해 잠재 고객 유입 확대
- Lighthouse를 통해 성능을 분석하여 Webpack 번들 최적화, Code Splitting, 렌더링 차단 리소스(CSS, JS) 최적화를 통해 로딩 속도 개선
백오피스
- Mixin 패턴을 활용하여 컴포넌트를 기능 단위로 분리하고 공유함으로써, 코드 중복을 줄이고 재사용성을 높여 개발 과정에서 시간과 자원을 절약할 수 있었으며, 코드의 유지 보수성이 향상
- 실시간 현장 접수 및 사전 예약 차량의 세부 관리 기능을 통해 고객의 예약 상태를 실시간으로 확인하고 관리 및 예약 누락이나 중복 예약을 방지하고 업무 효율성이 향상
- 일자별 매출 통계 관리 기능을 도입하여, 일별, 월별, 연도별 매출 데이터를 정확하게 추적하고 분석
- 직원 및 관리자 등록, 수정, 삭제에 대한 로그 관리 기능을 통해, 시스템 내 모든 변경 사항을 기록하고, 필요 시 문제 발생 시점이나 원인을 신속하게 추적할 수 있게 되어 보안 및 운영 안정성 향상
- 캘린더 형식의 차량 예약 현황 기능을 구현하여, 시각적인 예약 관리가 가능해지고 예약 일정 관리를 직관적으로 할 수 있어 작업 속도가 증가
- 차량 이동 시 로그 기능을 통해 차량의 이동 경로와 상태를 정확하게 추적할 수 있어, 차량 관리 및 고객 대응이 용이하게 함
- 실시간 문자 발송 여부 관리 기능을 개발하여, 고객에게 중요한 정보나 변경 사항을 실시간으로 전달할 수 있게 되어, 고객과의 소통이 원활해지고 예약 취소나 변경에 따른 혼란 최소화
- 차량 이미지 브라우저 캐싱을 통해 동일 차량에 대한 로딩 속도 1초에서 0.3초로 개선
- Lighthouse를 통해 성능을 분석하여 Code Splitting 및 Dynamic Import를 통해 로딩 속도 개선
[Backend]
- 다양한 플랫폼에서 필요한 기능의 RESTful API 개발을 통해 여러 플랫폼에서 일관된 데이터를 제공할 수 있게 되었고, 시스템의 확장성 및 유연성 향상
- 조회 빈도가 높은 테이블에 대한 최적화(Sequelize에서 직접 쿼리와 인덱스 추가로 변경) 작업으로 조회 속도를 2초에서 0.5초로 크게 개선하여 사용자 경험이 크게 향상 및 대용량 트래픽에 대한 대비가 가능해져 시스템 안정성이 강화
- Consola 로그 세분화 및 Slack 연동을 통해 디버깅 효율이 크게 향상 및 실시간으로 에러를 공유함으로써 문제 발생 시 신속하게 대응할 수 있었고, 이를 통해 시스템 가동 시간을 극대화하고 서비스 중단 시간을 최소화
- 소켓 통신과 스케줄러를 활용한 공항과의 실시간 차량 데이터 공유 기능을 구현함으로써, 공항과 차량 간의 데이터 동기화를 통해 공항의 실시간 데이터와 차량 배차 시스템이 정확하게 일치시켜 서비스 품질과 고객 만족도가 향상
- 국정원 보안 규정을 준수한 데이터베이스 AES 암호화를 통해 데이터 보안이 강화 및 민감한 데이터를 처리하는 시스템에서 중요한 역할을 했으며 개인정보보호에 대한 신뢰도를 높이는데 기여
- 문자 서비스 및 카카오 알림톡 연동을 통해 사용자 알림 기능을 강화하여, 중요한 정보나 알림을 사용자에게 신속하게 전달 및 고객 대응 속도와 만족도가 향상되었으며, 고객 이탈률을 줄이는데 기여
✅ 초기 300명 대비 2024년 7월 기준 일일 이용객 2,000명 이상 달성하여 회사 매출 성장에 기여
▶️ 관련기사
*https://news.heraldcorp.com/view.php?ud=20230821000702*
*https://www.segyebiz.com/newsView/20231013514797?OutUrl=naver*
*https://www.enewstoday.co.kr/news/articleView.html?idxno=1651018*
회고
*- 초기 백엔드 러닝 커브로 인한 어려움을 지속적인 자기 계발을 통해 극복하고, 서비스 안정화에 기여
- 운영 중인 서비스의 특성상 실시간 대응과 에러 핸들링의 중요성을 깊이 체감하며, 코드 리뷰를 통해 간결한 코드의 중요성뿐만 아니라, 직관적인 코드 작성과 디버깅 효율성을 높이기위해 로직 중간중간 로그의 필요성을 배움
- 실사용자의 입장에서 고민하며 개발하고, 수동적인 개발이 아닌 기획자와 긴밀히 소통하여 사용자 친화적인 UX로 지속적인 리팩토링
- 풀스택 개발 경험을 통해 백엔드에 대한 이해도 향상 및 효율적인 개발 방법을 모색하며 프로젝트를 성공적으로 완수*
하이파킹 통합 주차장 연동 플랫폼, TIPTAP(Turu ticket & Turu Autopass Pay)
2024.06 - 10
Next.js / TypeScript
파트너사(하이파킹, 다래)와 연동사(카카오, 네이버, 42dot)의 주차장별 개별 로직 통합 및 관리
[Frontend]
백오피스
- 컴포넌트 및 타입을 기능 단위로 분리하고 합성하여 재활용성을 높이며 MVC 모델 적용함으로써, 코드의 가독성과 유지 보수성 향상 및 새로운 기능 추가 시 개발 속도 증가, 코드 재사용이 용이해져 전체적인 개발 효율성이 증대
- GNB(Gobal Navigation Bar)와 Breadcrumbs 영역 구현으로 사용자에게 직관적인 UI를 제공. 원하는 정보에 빠르게 접근할 수 있도록 하여 사용자 경험이 개선되었으며, 개발자에게도 페이지 구조의 일관성을 유지할 수 있도록 해 개발 편의성이 향상
- Recoil을 활용한 페이지별 전역 상태 관리를 통해 상태 관리의 복잡성을 줄이고, 상태 변경 시의 성능을 최적화 및 페이지 간 상태 공유 증가, 상태 관리 로직이 명확해져 디버깅과 유지 보수 용이하게 함
- 관리자 계정의 생성, 수정(비밀번호 및 역할 변경), 삭제, 조회 기능을 통해 관리자 권한 및 계정을 효율적으로 관리. 이로 인해 관리자의 역할 분담이 명확해졌고, 보안성이 강화
- 연동사 등록, 수정(토큰 재발급 가능), 삭제, 조회 기능을 통해 각 연동사의 정보를 체계적으로 관리. 이는 연동사의 정보가 최신 상태로 유지되도록 하여, 연동 서비스의 신뢰성과 정확성을 높이는 데 기여
- 다양한 조건으로 필터링, 검색, 내보내기 가능한 자동 결제 리스트, 일반 결제 리스트, 주차장 리스트 제공 기능을 통해 사용자에게 필요한 데이터를 손쉽게 찾고 활용할 수 있게 하여, 업무 효율성 증가 및 데이터 내보내기 기능을 통해 보고서 작성 용이하게 함
- 전체 주차장, 연동사별 오픈된 주차장 정보 조회 및 주차장별 할인권 리스트 관리를 통해 주차장과 관련된 모든 정보를 한눈에 파악할 수 있어, 운영의 효율성이 증대 및 주차장 관리와 고객 서비스가 원활
- 전체 할인권, 주차장별 할인권, 오픈된 할인권 관리 및 할인권 예약 내역 조회 기능을 통해 할인권 체계적으로 관리. 이를 통해 할인권의 오남용을 방지하고, 고객에게 정확한 할인 정보를 제공하여 서비스의 신뢰도를 높임
- 매출 현황 및 각종 서버(관리자, 코어, 브릿지)의 상태를 확인할 수 있는 Health Check 기능을 통해 운영 현황을 실시간으로 파악. 이를 통해 서버 이상 징후를 조기에 감지하고, 신속하게 대응함으로써 서비스 중단을 최소화하고 시스템 가용성 극대화
회고
*- MVC 패턴을 적용하여 역할을 분리, 유지보수성과 확장성을 높이며 코드 가독성을 개선. 이를 통해 디자인 패턴의 장단점을 경험하며 향후 프로젝트에 적용할 계획
- 작은 단위로 쪼개진 공통 컴포넌트 및 타입의 모듈화로 재사용성, 합성, 디버깅 효율성을 극대화
- 개발 서버 구축 과정에서 Docker에 대한 깊은 이해의 필요성을 인식하고, 이를 바탕으로 지속적인 자기계발을 통해 Docker 활용 능력을 향상 중*
하이파킹 세차서비스 플랫폼, Turu Care
2023.11 - 2024.03
Nuxt.js
Total Cleaning Service ‘Turu CARE’는 차량 세차부터 주차장 청소까지 전국 1,300여 개소 주차장 운영 노하우를 기반으로 고객이 원하는 맞춤형 서비스를 제공하는 서비스로 전국 27개소의 프리미엄 세차 운영을 통해 Total Car life Management System을 실현시킬 수 있는 A to Z 차량 관리 서비스 및 습식 바닥 청소차를 운용하여 깨끗한 주차장 환경 유지 및 관리를 기본으로 주차장 방역 및 소독 관리 등의 서비스 제공
[Frontend]
백오피스
- 페이지별로 동일하게 들어가는 필터링 공통화 작업을 통해, 중복된 코드를 줄이고, 유지 보수성을 높여 필터링 기능의 일관성을 유지하고, 새로운 페이지 추가 시 개발 시간이 절감
- 카카오지도 API와 연동하여 세차장 위치 공유 기능을 구현함으로써, 사용자가 손쉽게 세차장 위치를 확인하고 접근을 통해 사용자 편의성이 향상
- 예약 관리, 기본 정보 관리, 세차장 등록 기능을 통해 매장의 세부 사항을 체계적으로 관리 및 이를 통해 매장 운영의 효율성이 증대
- 계정 생성, 수정, 삭제를 포함한 일반 회원 계정 관리 및 관리자 계정 관리 기능을 구현함으로써, 사용자와 관리자 계정의 효율적인 관리
- 표준 상품 및 옵션 관리, 차량 모델 관리, 지역 관리 기능을 통해 운영 효율성 증대 및 이로 인해 관리자들이 다양한 상품과 서비스를 효과적으로 관리할 수 있게 되어, 운영의 복잡성이 줄어들고 서비스 품질이 개선
- 키오스크 조회 및 사이니지 관리 기능을 통해 현장 운영의 편의성이 향상. 이로 인해 고객이 현장에서 정보를 쉽게 확인하고, 서비스를 이용할 수 있게 되어 고객 만족도를 높임
- 매출 현황 관리 및 문의 내역 정리 기능을 통해 매출 흐름을 정확하게 파악하고, 고객 문의를 효과적으로 처리하여 재무 관리를 체계적으로 할 수 있게 되었으며, 고객 서비스의 질이 개선
- 알림톡 조회 및 관할별 노출 관리 기능을 통해 고객 커뮤니케이션을 체계적으로 관리하여 고객에게 적절한 정보와 알림을 전달하여, 고객 만족도가 상승하고, 불필요한 혼란을 줄임
- 월간 대시보드를 통한 주요 운영 지표 시각화로 관리자들이 주요 성과 지표를 쉽게 모니터링 함으로써, 운영 상태를 실시간으로 파악하고, 필요한 조치를 신속하게 취할 수 있게 되어 운영 효율성이 향상
- 고객 지원과 관련된 공지사항 및 자주 묻는 질문(FAQ) 관리 기능을 구현함으로써, 고객이 필요한 정보를 빠르게 찾을 수 있게 되어, 고객 지원의 효율성이 향상
회고
*- 다양한 플랫폼(어플리케이션, 백오피스, 클라이언트, 서버)으로 구성된 프로젝트를 통해 팀원 간 적극적인 질문과 피드백의 중요성을 깨달음. 기술적 이해도 차이를 극복하기 위해 부족한 부분을 솔직하게 공유하며 효과적인 소통을 이끌어냄
- 방대한 데이터와 다양한 페이지 처리 과정에서 디자인 패턴 적용을 통해 코드 가독성과 확장성의 중요성을 실감하고, 이를 바탕으로 코드 품질을 개선*
하이파킹 발렛서비스 플랫폼, TVALET
****2023.06 - 09
Nuxt.js
거점별 속해있는 발렛 주차장관리 및 개별 주차장 발렛 서비스를 관리하는 플랫폼으로 차량입출차 및 직원 근태관리 등 발렛 관련 서비스를 제공