카
카카오엔터테인먼트FE
April 3, 20231회
View Transitions API
간단 소개
View Transitions API는 외부 라이브러리 없이 화면 전환 효과를 쉽게 구현하도록 돕는 실험적인 Web API입니다. 간단한 사용법과 다양한 활용 예시를 제공합니다.
AI Summary
- View Transitions API 소개 및 필요성
- 외부 라이브러리 없이 화면 트랜지션을 쉽게 구현하는 Web API
- 기존 방식의 복잡한 트랜지션 구현의 어려움 해소
- 실험적 API로 Chrome, Edge 등 일부 브라우저에서만 지원
- API 사용 예시 및 효과
document.startViewTransition을 사용한 간단한 트랜지션 구현 예시 (fade-in/out 효과)- 기존 방식 대비 코드 간결성 및 개발 효율성 향상
- 트랜지션 과정: 화면 캡처 후 교차하여 보여줌,
::view-transition가상 요소 생성
- 추가 트랜지션 및 고급 활용
- CSS keyframes 및
view-transition-name속성을 이용한 슬라이드 효과 추가 - 썸네일 확장 애니메이션 구현 시 위치 계산 및 동적 스타일 변경 필요
transition.ready,transition.finished속성을 활용한 트랜지션 제어- 크롬 개발자 도구의 Animations 탭을 이용한 디버깅 방법 소개
- CSS keyframes 및
Next Feeds

지난 9개월간의 딜리버리프로덕트팀의 경험과 변화에 대한 이야기: 애자일
컬리 딜리버리프로덕트팀의 9개월간 애자일 도입 여정과 변화를 분석하고, 팀워크 향상 및 효율성 증대 효과를 제시합니다.
애자일스크럼팀워크소프트웨어 개발컬리
2023. 3. 30.
컬리
웹에서 파일 선택하기: onShowFileChooser()를 이용한 단일 및 복수 파일 선택 방법
안드로이드 WebView에서 onShowFileChooser()를 사용하여 단일/복수 파일 선택을 구현하고, 권한 처리 및 결과 전달 방법을 설명합니다.
WebChromeClientonShowFileChooserWebViewFileChooserIntent
2023. 3. 30.
PRND
프론트엔드와 SOLID 원칙
SOLID 원칙을 프론트엔드 개발에 적용하는 방법과 카카오페이지 사례를 통해 각 원칙의 실질적인 적용 방안을 제시합니다.
SOLIDSRPOCPLSPBFF
2023. 3. 30.
카카오엔터테인먼트FE
프론트엔드와 SOLID 원칙
SOLID 원칙을 프론트엔드 개발에 적용하는 방법과 카카오페이지 사례를 통해 각 원칙의 중요성과 실질적인 적용 방안을 제시합니다.
SOLIDSRPOCPLSPBFF
2023. 3. 30.
카카오엔터테인먼트FE

6시간 동안 단체로 해외 콘퍼런스 참여하기: 프로덕트콘 같이 보기 이벤트 - ProductCon London 2023
컬리 기술팀은 ProductCon London 2023을 함께 시청하며 프로덕트 매니지먼트 트렌드를 파악하고, 고객 중심 사고 및 애자일 방법론의 중요성을 확인했습니다.
프로덕트콘Product-Led-Growth애자일프로덕트 매니지먼트고객 파트너십
2023. 3. 29.
컬리
유저와의 환상적 콜라보! 블랙박스로 표지판 정보 얻기 - 19편 – 모바일 환경에서 YOLO 돌려보기 (방면표지판인식)
TMAP은 블랙박스 기반 표지판 정보 수집을 위해 YOLO와 Object Tracking 기술을 활용, 모바일 환경 적용 및 데이터 최적화를 진행 중이다.
YOLOObject DetectionObject Tracking블랙박스TMAP
2023. 3. 24.
티맵모빌리티