브래닛 서비스의 프론트엔드를 담당하며 기존 코드 인수인계 이후 신규 기능 개발, 구조 리팩토링, 운영 중 발생하는 버그 대응까지 전 범위를 수행했습니다. 1~2주 단위 스프린트로 빠르게 배포하고, 지표와 사용자 피드백을 기반으로 문제를 정의·개선하는 업무 방식을 경험했습니다. 백엔드 개발자와 기능 스펙을 함께 정리하고 운영 이슈를 공동으로 해결하며, 의사결정의 근거를 명확히 하는 데 기여했습니다. 1. 핵심 요청 흐름에서 입력이 끊기지 않도록 구조 개선 - 요청 작성 도중 나가기·새로고침이 발생하면 처음부터 다시 작성해야 하는 문제가 반복적으로 발생 - 입력 중인 정보는 화면 상태로 관리하고, 실제 저장·조회 데이터만 서버 요청으로 분리해 화면 전환이나 재요청이 사용자 입력에 영향을 주지 않도록 정리 - 단계별로 꼭 필요한 값과 제출 조건을 명확히 해, 중간 단계에서 잘못된 상태로 넘어가는 경우를 사전에 차단 [Impact: 입력값 유실 관련 문의 대폭 감소, 요청 완료 흐름 안정화] 2. 사용자 전환 과정에서 발생하던 데이터 오류 문제 해결 - 하나의 브라우저에서 여러 사용자나 회사 정보를 오가며 사용하던 중, 이전 정보가 남아 잘못된 요청으로 이어질 수 있는 문제를 확인 - 사용자와 회사 기준으로 상태를 명확히 나누어, 다른 상황의 정보가 섞이지 않도록 구조를 정리 - 로그아웃이나 이탈 시점에는 이전 정보가 남지 않도록 초기화 흐름을 추가 [Impact: 잘못된 요청 제출 가능성 제거 및 관련 문의 감소] 3. UI 동작 표준화 및 Storybook 기반 공통 컴포넌트 정비 - 분산되어 있던 팝업·버튼·입력 UI를 공통 컴포넌트로 통합하고 동작 기준을 정리해, 수정·확장 시 영향 범위를 예측할 수 있는 구조로 개선 - 공통 UI 컴포넌트를 Storybook에 정리해 상태별 동작을 사전에 확인할 수 있도록 구성하고, 신규 UI 구현 시 기준점으로 활용 - 디자이너·기획자와 Storybook을 기준으로 UI 변경 사항을 공유해 구현 결과에 대한 오해와 QA 수정 커뮤니케이션 비용 감소 [Impact: UI 수정·확장 시 영향 범위가 명확해져 유지보수 부담 감소, 신규 화면 개발 속도 향상, QA 반복 수정 및 협업 커뮤니케이션 비용 절감] 4. 사용자 행동 데이터 기반으로 서비스 이용 흐름 분석 체계 정비 - 사용자 행동 흐름을 더 직관적으로 보기 위해 PostHog를 도입하고, 기본 제공되는 자동 이벤트 수집 기능을 활용해 페이지 이동·클릭 등 주요 행동 데이터를 수집 - 특정 행동 패턴을 기준으로 코호트(Cohort)를 생성해 탐색만 하고 전환하지 않은 사용자, 특정 기능을 반복 사용하는 사용자군 등을 구분 [Impact: 사용자 행동 흐름을 운영 관점에서 구분해 볼 수 있는 기준 마련, 감이 아닌 데이터 기반으로 실무 의사결정에 참고 지표로 활용]

더보기

소규모 팀(개발 3명)에서 React Native 앱 및 Next 웹 프론트엔드 기능 구현을 담당했습니다. 1. 서비스 성능 개선 및 렌더링 전략 최적화 - 렌더링 지연, 이미지 로딩 속도 저하, 중복 API 호출로 인해 페이지 진입과 화면 전환 시 사용자 체감 속도가 지속적으로 저하 - 컴포넌트 렌더링 최적화와 데이터 캐싱을 통해 불필요한 다시 그리기와 중복 요청을 제거 - 페이지 목적과 데이터 변경 주기에 따라 SSG / SSR / ISR / CSR을 구분 적용해 성능과 운영 효율을 함께 고려한 구조로 개선 - 정적 페이지는 미리 생성하고, 사용자 상호작용이 많은 화면은 클라이언트 중심으로 구성 [Impact: 초기 페이지 로딩 속도 개선, 초기 페이지 로딩 속도 단축, 서버 부하 및 API 트래픽 감소] 2. 병원 지도 화면 렌더링 최적화 및 사용자 경험 개선 - 지도 이동 시마다 데이터가 자동으로 다시 조회되며 화면 깜빡임과 마커 중복 렌더링 문제가 발생 - 사용자의 명시적인 동작에 따라 데이터 요청이 이루어지도록 흐름을 정리 - 이미 표시된 마커는 재사용하도록 처리하고, 지도 관련 로직을 분리해 예기치 않은 화면 튐 현상 제거 [Impact: 지도 화면 반응성 개선 및 불필요한 API 호출 감소, 사용자 지도 이용 만족도 향상] 3. 앱 업데이트 및 장애 대응을 고려한 유지보수 구조 개선 - 앱 스토어 심사 지연으로 인해, UI 수정이나 긴급 장애 대응이 늦어지는 문제가 반복 - React Native 기반 앱에 WebView 구조를 적용해 주요 화면을 웹에서 관리하도록 구성 - CodePush를 도입해 앱 재배포 없이도 JS 코드 및 화면 수정 사항을 즉시 반영할 수 있도록 개선 - 실제 로그인 장애 발생 시, 앱 업데이트 없이 수정 사항을 배포해 빠르게 서비스 정상화 [Impact: 장애 발생 시 1일 이내 대응 가능, 콘텐츠·기능 수정 배포 주기 단축]

더보기

반려동물 플랫폼 '와요/펫플래닛'의 앱 및 내부 어드민 서비스를 개발했습니다. 1. 앱 유지보수 및 신규 기능 개발 - React Native 기반의 앱 안정성 개선 - 운영 효율화를 위한 사내 백오피스(Admin) 기능 확장 및 UI 개선

더보기

WPF(C#) 기반 FPGA 장비 데이터 모니터링 프로그램 개발