Frontend

Developer

UI 구현 경험을 바탕으로 기술적 UX를 설계하는 프론트엔드 개발자 이채영입니다.
사용자 인터랙션과 흐름을 고려한 UI를 통해 더 나은 사용자 경험을 만드는 데 집중합니다.

About Me

안녕하세요,
UI 구현 경험을 바탕으로
기술적 UX를 설계하는
프론트엔드 개발자입니다.

약 2년간 프론트엔드 개발을 경험하며 React/TypeScript와 Vue를 사용해왔고, 그 이전에는 4년 이상 UI 구현을 담당했습니다.

단순히 디자인을 구현하는 데 그치지 않고, 사용자 인터랙션과 흐름을 고려해 더 자연스러운 경험을 만드는 데 집중합니다.

또한 반복되는 UI 패턴을 구조화하고, 브라우저 동작 원리를 기반으로 성능과 사용자 경험을 함께 개선하는 데 강점이 있습니다

배운 내용을 정리하고 공유하는 걸 좋아해서 꾸준히 기록하고 있고, 그게 다른 사람에게 도움이 될 때 가장 보람을 느낍니다.

프로필 보기
이채영
Skills

탄탄하게 쌓아온
기술 스택

Frontend Development

ReactNext.jsJavaScriptTypeScriptHTMLCSSZustandTanStack Query

Styling & UI

Tailwind CSSStyled-ComponentsSCSSRadix UIShadcn UI

Tools & Workflow

GitFigmaJiraCursorClaude Code
Career

다양한 프로젝트를 통해
쌓아온 경험들

LG Uplus 서비스 운영

VueNuxt
  • UI 개편(팝업 → Select Box)으로 변경된 API 응답 구조를 분석, 기존 수정·삭제 로직을 재사용할 수 있도록 데이터 구조를 설계하여 신규 UI에 적용
  • 가입 플로우 내 2~3개 컴포넌트에 분산된 ValidationObserver 호출 로직을 ref기반 공통 함수로 통합 → 가입 완료 시점의 유효성 검사를 한곳에서 제어, 이후 validation 추가 및 수정시 변경 지점 1곳으로 축소
  • 신규 부가 서비스 가입 플로우 전반을 검토하여 예외 케이스를 사전 발견 → 기획서 수정 및 API 스펙 재설계 제안 → 출시 전 오류 사전 차단

한양대학교 인터칼리지 구축

Next.jsTanStack QueryZustand
  • 3인 팀 리딩 및 Jira 기반 스프린트 관리, openapi-typescript 팀 도입 시 가이드 작성 및 온보딩 주도
  • 사용자 화면 렌더링보다 통계성 API가 먼저 호출되는 구조를 분석, requestIdleCallback 기반 후순위 처리로 전환 → LCP 54% 개선
  • 반복되는 UI 컴포넌트를 합성 컴포넌트 패턴으로 추상화하고, 5~6개 페이지에 공통 적용되는 레이아웃을 Slot 패턴으로 구조화 → 중복 컴포넌트 제거 및 레이아웃 확장성 증가
  • 외부 라이브러리 전체 import로 인한 빌드 용량 초과 이슈를 Tree Shaking 적용으로 해결 → 빌드 용량 75% 감소
  • Client Component로 전환하는 과정에서 모든 상태가 쿠키에 저장되던 구조를 개선, 인증 스토어와 일반 스토어를 분리하여 불필요한 쿠키 전송 제거 → 팀 전체에 개선 사항 공유 및 적용
  • 외부 인증 시스템 연동(SSO 통합 로그인, PASS 본인인증) 구현

LG CNS 아테네 ABT 시스템 - 앱 기반 서비스의 웹 반응형 전환

VueNuxtTailwindCSS
  • 기존 앱 전용 UI 약 20~30개 화면을 PC·모바일 2 breakpoint 반응형으로 단독 전환, 1개월 내 완료

구강암 예방 헬스케어 앱 개선

ReactTypeScriptZustand
  • 런칭 전 내부 기능 테스트 및 코드 분석을 통해 10건 이상 이슈 사전 발견 및 수정 → 안정적 런칭 기여
  • API 중복 호출 이슈 분석, 단일 요청으로 통합 → 페이지 로딩 최적화

Blog

기록하며
성장합니다

Contact
궁금한게 생기면,
언제든 메일주세요.
Mail me