미리보기

부동산 경매를 위한 지도 기반 부동산 매물 검색 플랫폼 미스고부동산을 개발 및 유지보수하고 있습니다.

Google Search Console 및 Lighthouse 데이터를 통해 웹사이트 성능을 분석하고 SEO 및 LCP 최적화를 통하여 사용자에게 더 나은 경험을 제공하였습니다.

코드 리뷰 도입, 테스트 코드 작성, 빌드 및 배포 자동화, CI/CD환경 구축, Front-end팀 규칙 문서화등의 활동으로 개발 환경을 개선하기 위해 노력하였습니다.

Llama2 AI를 활용한 채팅 서비스 PAION을 개발했습니다.
시작 단계에서부터 합류해 기획/디자인 단계에 참여하여 유저에게 더 나은 경험을 제공할 수 있도록 기여하였습니다.
코드리뷰 및 아티클 공유 문화를 조성하고 팀원과 함께 성장하기 위해 노력하였습니다.

모바일 웹 사용 빈도가 늘어나면서 화면 깨짐 현상으로 고객 문의가 급증, 이는 고객 이탈로 이어질 가능성이 높다고 판단하여 모바일 웹을 개발

• percent 기반의 반응형 디자인을 고려했으나, 앱과 동일한 디자인을 제공하는 것이 사용자 경험에 더 적합하다고 판단하여 모바일 웹을 별도로 구현함

사용기술: React Next.js Typescript Jest CSS Module

확장 및 신설이 예정된 도로의 정보를 제공해주는 기능 개발

• Naver map Api 기반 Polygon 구현 및 애니메이션 개발

• 코드의 안정성과 품질 향상을 위한 테스트 코드 도입

• emotion의 RSC 한계로 인해 RSC을 적용할 수 없어서 module CSS를 도입

• RSC를 통해 Lighthouse 점수 12점 상승 및 LCP 1초 개선

사용기술: React Next.js Typescript Jest CSS Module

좌표 데이터를 저장하는 과정을 매달 수동으로 진행해 왔음, 이로 인해 개발 및 운영 리소스가 소모되어 생산성에 문제가 있다고 판단되어 자동화 시스템을 구축

• 좌표 압축, 지역별 경계선 좌표 다운로드 및 일부 수동 작업의 스크립트를 작성하여 자동화 시스템 구축

• 디버깅 및 데이터 확인을 위한 슬랙 봇 제작

• 운영 리소스 월 30% 절감으로 업무 생산성 향상에 기여

사용기술: Python PostgreSQL QGIS AWS Lambda

기존 서버가 아마존 EC2에 통합되어 있어 CPU 사용량이 많은 크롤링 작업 중에 사용자의 요청이 몰리게 되면 Time out이 발생하는 문제가 있음

• 크롤링 서버를 EC2에서 분리하여 회사 내부 PC에서 동작하도록 구성하여 EC2 서버 CPU 사용률 70% 감소

• 기존 S3에 저장된 파일을 크롤링 서버에 저장하여 S3 Outbound Traffic Cost 월 300유로 절약

사용기술: Python Kafka AWS S3 AWS EC2 AWS Lambda

이탈률 82%의 문제를 해결하기 위해 검색 페이지 및 상세 페이지의 가독성 문제를 사용자 설문조사를 통해 확인

• 연령대가 높은 사용자층을 고려하여 텍스트 크기, 색상 대비, 레이아웃 등 사용자 편의성을 강화한 UX 설계 적용

• 사용성 테스트와 데이터 분석을 바탕으로 최적화된 디자인 도입, 사용자 만족도 및 참여도 향상시킴

• 그 결과, 페이지 이탈률을 24% 감소시켜 82%에서 58%로 크게 개선

사용기술: React Next.js Typescript Recoil Google Analytics

현재 사용자에게는 큰 문제가 없으나, 프로젝트가 고도화되면서 성능 저하의 가능성을 인지하고 이를 개선함

• 컴포넌트에 memoization을 적용하여 페이지 리렌더링 횟수를 줄임

• 이미지에 lazy loading을 구현해 초기 로딩 시간을 3초에서 1.2초로 단축함

사용기술: React-Native

PR 제출 전 수동으로 빌드와 테스트 코드 실행을 확인하는 과정에서 비효율성을 느낌

• 이를 개선하기 위해 Github Actions를 도입하여 자동으로 빌드 및 테스트 코드를 실행하도록 구현

• 이를 통해 작업 시간을 단축하고 워크플로우의 효율성을 향상시킴

사용기술: Github Actions

Llama2 AI를 활용한 채팅 서비스

• 프로젝트 초기 개발부터 담당하여 진행(JWT 인증, socket)

• React Native Remote bundle Versioning 정책 설계

• Rabbit MQ 기반 message queue 개발

사용기술: React-Native Typescript Context API Jest