올리브영 앱 스마트 스캐너 개선
올리브영 앱 스마트 스캐너의 바코드 인식률을 개선한 사례를 소개했습니다. iOS는 Vision, Android는 CameraX와 MLKit으로 전환해 이벤트 사용성을 높였습니다.
#iOS#Android
6900
프론트엔드 기술 블로그 최신 글
필터 0
HEIC 파일 포맷 지원을 통한 사용자 경험 향상 시키기
이미지 업로드에서 HEIC 파일로 인한 오류를 해결하기 위해 파일 시그니처를 검사하는 방법을 소개했습니다. 브라우저에서 HEIC를 감지하고 JPEG로 변환해 사용자 경험을 개선하는 방안을 설명했습니다.
#JavaScript#UI/UX
1800
API 없이 웹 애니메이션 구현: 인터랙티브 웹 개발 1편
API 없이 수학과 물리 개념으로 웹 애니메이션을 구현한 과정을 공유했습니다. 카카오페이의 트리 조명 애니메이션 개발 사례와 인터랙티브 웹 접근을 소개했습니다.
#web#CSS
1500
Backend , Frontend 공통 IDL 적용
백엔드와 프론트엔드의 API 타입을 공통 IDL로 통일한 도입 사례를 소개했습니다. 중복 작업을 줄이고 인터페이스 히스토리와 통신 규약을 함께 관리한 과정도 정리했습니다.
#TypeScript#API
300
토스가 꿈꾸는 React Native 기술의 미래
토스가 React Native를 선택한 이유와 현재 운영 방식을 소개했습니다. 마이크로 프론트엔드, ESBuild, 번들 분리로 사용자 경험과 개발 생산성을 함께 높이고자 했습니다.
#React Native#WebView
6200
웹에서 프리 드로잉 밑바닥부터 구현하기
웹 Canvas에서 자연스러운 프리 드로잉을 구현한 과정을 소개했습니다. 브라우저와 펜 입력 특성 차이를 보정하며 필기감을 개선했습니다.
#Canvas API#베지어 곡선
2200
웹사이트의 첫 삽부터 나무를 기르기까지: 당근닷컴 디벨롭의 여정
당근닷컴 웹사이트를 처음 만들고 글로벌 리뉴얼과 내부 데이터 레이어 Jampot을 도입한 과정을 정리한 글입니다. URL 정책, 링크 연동, 캐싱, SEO 운영까지 웹사이트 오너십을 키워간 여정을 설명했습니다.
#Next.js#GraphQL
5800
선물하기 UX 개선
선물하기 서비스의 복잡한 주문·수락·조회 흐름을 줄이고 다건 주문과 배송 정보 연동을 추가해 UX를 개선했습니다. 기존 구조와의 호환성을 유지하면서 사용 편의성과 일관성을 높였습니다.
#UX/UX#module
3500
Vue3, Composition API와 Pinia를 이용한 상태관리 (2)
Vue3 Composition API와 Pinia를 실제 서비스에 적용한 사례를 다루었습니다. 인재풀 화면에서의 적용 결과와 느낀 점을 함께 정리했습니다.
#Vue.js#Pinia
2600
자동화 전문가 팀의 블로그 시작기
부스터스 테크 블로그를 시작한 배경과 초기 구축 과정을 공유했습니다. Jekyll 기반 정적 사이트와 SEO 설정으로 블로그 정체성과 노출을 함께 챙겼습니다.
#Jekyll#SSG
2300
당근페이 FE, 4개의 프로젝트를 하나로 합치며 나눈 대화들
당근페이 프론트엔드가 4개 프로젝트를 원레포·원도메인 구조로 통합한 배경과 논의 과정을 공유했습니다. 폴더 구조를 page, shared, common 기준으로 정리하며 기준을 세워가는 방식을 소개했습니다.
#폴더구조#monorepo
4700
전환율 34% 향상시킨 가격 비교 경험 개선
가격 비교 유입 고객의 주문 여정에서 할인 인지와 쿠폰 적용 마찰을 줄여 전환율을 개선했습니다. 제휴 가격 일치와 쿠폰 자동다운·자동적용으로 주문완료 전환율을 34% 높였습니다.
#전환율#UI/UX
2400
물 흐르듯 자연스러운 화면 전환을 향한 여정
LINE iOS 대화방의 화면 전환을 더 자연스럽게 만들기 위해 FluidTransition을 설계하고 구현한 과정을 공유했습니다. 중단 가능성과 입력 반응성, 스냅샷 성능까지 고려한 전환 개선 경험을 소개했습니다.
#iOS#UIKit
2400
React + TypeScript 전환기 (Feat. msw)
사람인 채용달력 모바일 서비스를 React와 TypeScript로 전환한 사례를 다뤘습니다. 기존 Vue 기반 경험에서 FE 분리 전환 과정과 MSW 활용 맥락을 소개했습니다.
#React#TypeScript
4100